我今天也学习了做jquery插件】的更多相关文章

先贴代码 (function ( $ ) { var id=33; $.fn.validate=function(options){ // This is the easiest way to have default options. var settings = $.extend({ // These are the defaults. color: "#556b2f", backgroundColor: "white" }, options ); // Gre…
日前的一个项目需要用到语音播放功能.发现Audio5js符合需求且使用简单,又鉴于jQuery控件便于开发操作,于是有了以下的封装. 首先先简单介绍一下Audio5js吧. Audio5js是一个能够帮助你解决类似这样的浏览器兼容性问题的js类库,轻量级并且能够很优雅的使用flash向前兼容老版本的浏览器. 其主要特性: 拥有完整API来控制“加载”,“播放”,“暂停”,“音量”和“查找” 并且可以得到播放内容的具体相关信息 不依赖任何类库 兼容版本浏览器,包括:IE8, IE9, Chrome…
前言:这种东西随意可以在网上收到,这里我还是只是记下自己的见解和领. 第一种方式 (function ($) { $.extend({ sayHello: function (name) { alert(name + ": hello"); } }); })(jQuery); $.sayHello("meng"); 这种属于静态方法,直接调用即可. 第二种方式: (function ($) { $.fn.redBg = function () { $(this).c…
我们先来看一个最简单的例子: (function($){ $.fn.extend({     //把此插件添加到jQuery的原型上 pluginName:function(){   //插件的名字 return this.each(function(){     //遍历匹配元素的集合 //插件要实现的功能 }); } }); })(jQuery);   //传入jQuery对象 由于jQuery是集化操作($("div")会选择多个div元素进行操作),而我们的插件编写应该一个元素…
jQuery其他补充+ 4.1 链式编程: end()补充 * 补充五角星 评论案例 * 第一步:鼠标移入,当前五角星和前面的五角星变实体.后面的变空心五角星 * 第二步:鼠标点击的时候,为当前元素添加clicked类,其他的移除clicked类 * 第三步:当鼠标移开整个评分控件的时候,把clicked的之前的五角星显示实心 + 4.2 隐式迭代 * 默认情况下,会自动迭代执行jQuery选择出来所有dom元素的操作. * 如果获取的是多元素的值,默认返回的是第一个元素的值. + 4.3 ma…
此前一直想就关于Jquery插件的开发,做一个深入的学习,由于各种原因,当然主要是自己太懒了...今天就系统分析一下Jquery插件的开发(参考了http://www.xprogrammer.com/812.html)      1.对JQuery自身的扩展插件      直接上代码,代码中体会      $.extend({           handler:function(event){               .....//代码区           }      });    …
前端开发也工作了一段时间,Jquery代码页写了很多,但是都是些的很零散的,不是很好用,网上看了很多人写的Jquery 很好用,而且到每个项目中都可以使用, 本人就感觉很好奇他们是怎么做到的呢,于是自己也开始想学习封装一下,才用了Jquery插件的学习, 在学习Jquery的开发时候网上也看过了很多人写过例子但是都是很简单的,没有完整的从写插件方法到调用插件,有的要不就是很深的于是自己写一下自己的学的东西方便以后学习,和分享给和我一样在学习Jquery插件的朋友,废话不多说先上代码 (funct…
概要 jQuery插件就是以jQuery库为基础衍生出来的库,jQuery插件的好处是封装功能,提高了代码的复用性,加快了开发速度,现在网络上开源的jQuery插件非常多,随着版本的不停迭代越来越稳定好用,在jQuery官网有许多插件:http://plugins.jquery.com/ 一.插件开发基础 1.1.$.extend 在jQuery根命名空间下直接调用的方法可以认为是jQuery的静态方法或属性,常常使用方法名来调用,使用.方法名来调用,使用.extend这个静态方法可以完成两个功…
jquery插件的学习可以点击这里 举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('fontSize':"30px") } }) })(jQuery) <p class='p1'>好好学习天天向上</p> (function($){ $.fn.extend({ bigfont:function(){ return this.css('fontSize…
jquery插件的学习: HTML部分及应用 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> #float{border: 1px solid #e0e0e0; padding: 10px; position: absolute; width: 170px;} </style> <…