【原】jQuery编写插件

分享一下编写设置和获取颜色的插件，首先我将插件的名字命名为jquery.color.js。该插件用来实现以下两个功能1.设置元素的颜色。2.获取元素的颜色。

先在搭建好如下编写插件的框架：

;(function($){//这里编写插件代码
})(jQuery);

我这里采用jQuery.fn.extend().这种方法来编写，代码如下：

;(function($){$.fn.extend({"color":function(value){//这里写插件代码
        }});
})(jQuery);

这个方法可里面有一个value.参数，当给color().这个传入了参数那么就用来设置color.值，不传参数就是获取color().值。代码如下：

;(function($){$.fn.extend({"color":function(value){if(value==undefined){return this.css('color');}else{return this.css('color',value);}}});
})(jQuery);

最后我们来测试一下：

<body>
<script>$(function(){alert($('#div1').color());$('#div2').color('#333');});
</script><div id="div1" style="color:blue">blue</div><div id="div2" style="color:#ccc">#ccc</div>
</body>

测试结果如下图:

OK!测试没问题，全部完成。做这篇分享只是为了分享一下如何实现编写插件的整个过程

转载于:https://www.cnblogs.com/wswq/p/6262557.html

【原】jQuery编写插件相关推荐

jQuery编写插件
引言: 在项目中不同页面经常要用到已经写好的交互,比如弹窗,比如下拉菜单,比如选项卡,比如删除... 此时如果每次都把代码copy一份无疑是一件比较麻烦并且无趣的事情,而且个人认为有些low了,我们可 ...
jquery编写插件的三种方法
所需了解的知识点: 匿名函数 Function(){ Alert("hello!") } 拓展对象 $.Extend() Jquery内部对象 $.fn 闭包 Var niming ...
基于JQuery 编写轮播图插件
基于JQuery 编写轮播图插件不管是实际开发还是平时的小项目中 ,页面一定有且多个的轮播图,那么为了效率大家可以考虑封装这样的小插件.下面一起看看他的使用方法吧使用需要准备(往下滑动会看到): ...
jQuery图表插件Flot
最近正在使用JQuery的flot进行画图,但是这方面的中文帮助实在是太少了,干脆把英文的document直接翻译一下吧.因为也是再学习过程当中,难免会存在翻译不准确的地方,如果文中描述的不明白的话, ...
基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
超强1000个jquery极品插件！（连载中。。。。最近更新20090710）
花N长时间积累的Jquery插件,希望大家喜欢.大家还有什么新的插件,请留言,我们一并收录. 感谢大家的支持. ++++++++++++++++++++++++++++++++++++++++++++ ...
ajax 阻止默认提交,jQuery验证插件：在对ajax调用servlet时，submitHandler不会阻止默认提交-返回false无效...
我有一个使用jquery和servlet的简单表单.jQuery对Servlet进行Ajax调用,然后Servlet进行一些服务器端计算,然后通过jQuery在同一页面上显示结果.我不希望表单进行默认 ...
Jquery autocomplete插件
转自:https://www.cnblogs.com/Leo_wl/p/7845730.html Jquery autocomplete插件的使用示例回到目录 Jquery autocomplete ...
10个最好的 jQuery 视频插件(转)
在这篇文章中已经收集了 10 个最佳的 jQuery 视频插件,帮助开发人员容易地实现网站播放影片功能.可以显示视频和视频播放列表. 1. Bigvideo.js BigVideo.js 是一个 jQ ...

【原】jQuery编写插件

【原】jQuery编写插件相关推荐

最新文章

热门文章