jQuery正在大约60.000.000个站点中使用, 由于它的简单性和性能, 它已成为每个网站都应使用的基本库。
以下简单结构将定义我们的jQuery插件, 我们将准备创建自定义函数。
(function($){ $.fn.extend({// an object with our functions
});
})(jQuery);
结构与普通库几乎相同, 但是我们将接收jQuery, 而不是接收window对象。请注意, 你显然需要在插件之前加载jQuery。
jQuery是面向对象的, 因此我们的函数将具有我们赋予对象键的名称, 例如:
{// This will paint the background color of a div with our given value.myCustomAlert:function(color){this.css({
backgroundColor:color
});
}}// Then we will call it like this :$('#myselector').myCustomAlert('red');
如果你的插件不需要选择器, 但仍然需要jQuery, 则可以使用函数为jQuery创建一个属性, 例如
var createAlert = {showAlert : function(){// The code that will show the alert
},
hideAlert : function(){
// the code that will hide the alert
}};
$.myCustomAlert = createAlert;
// or if you want jQuery instead $jQuery.myCustomAlert = createAlert;
// Then execute your plugin like this$.myCustomAlert.showAlert();
这就是你要创建自己的jQuery插件时需要知道的所有内容。现在让我们创建更复杂的东西!
以下插件将在上一次keyup事件之后每隔x毫秒执行一次功能, 当你想要创建自动完成功能或提高每次用户按下键时执行的功能的性能时, 此功能很有用。玩以下小提琴, 可以在javascript选项卡中查看源代码。
【如何创建一个jQuery插件】玩得开心, 创建自己的jQuery插件!
推荐阅读
- 如何使用jQuery(serialize和serializeArray)序列化复选框将on和off值更改为布尔值true或false
- 如何使用Node.js中的Website Scraper克隆网站(下载HTML,CSS,JavaScript,字体和图像)
- 如何在Laravel中使用PHP Office创建Excel文件
- 如何为Laravel 5.3创建自定义控制台命令(工匠)
- 如何在Laravel中发送电子邮件(Gmail,Outlook和Zoho)
- QQ输入法自定义图片怎样弄?
- QQ输入法图标点亮办法
- qq输入法怎样改字体?
- IE浏览器弹出QQ输入法安全提示怎样办?