怎样编写一个jQuery插件
发布网友
发布时间:2022-04-23 17:10
我来回答
共1个回答
热心网友
时间:2022-04-22 17:04
为了方便用户创建插件,jquery提供了jQuery.extend()和jQuery.fn.extend()方法。
1. jQuery.extend() 方法有一个重载。
jQuery.extend(object) ,一个参数的用于扩展jQuery类本身,也就是用来在jQuery类/命名空间上增加新函数,或者叫静态方法,例如jQuery内置的 ajax方法都是用jQuery.ajax()这样调用的,有点像 “类名.方法名” 静态方法的调用方式。下面我们也来写个jQuery.extend(object)的例子:
//扩展jQuery对象本身
jQuery.extend({
"minValue": function (a, b) {
///《summary>
/// 比较两个值,返回最小值
///《/summary>
return a 《 b ? a : b;
},
"maxValue": function (a, b) {
///《summary>
/// 比较两个值,返回最大值
///《/summary>
return a > b ? a : b;
}
});
//调用
var i = 100; j = 101;
var min_v = $.minValue(i, j); // min_v 等于 100
var max_v = $.maxValue(i, j); // max_v 等于 101
重载版本:jQuery.extend([deep], target, object1, [objectN])
用一个或多个其他对象来扩展一个对象,返回被扩展的对象。
如果不指定target,则给jQuery命名空间本身进行扩展。这有助于插件作者为jQuery增加新方法。
如果第一个参数设置为true,则jQuery返回一个深层次的副本,递归地复制找到的任何对象。否则的话,副本会与原对象共享结构。
未定义的属性将不会被复制,然而从对象的原型继承的属性将会被复制。
参数
deep: 可选。如果设为true,则递归合并。
target: 待修改对象。
object1: 待合并到第一个对象的对象。
objectN: 可选。待合并到第一个对象的对象。
示例1:
合并 settings 和 options,修改并返回 settings。
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);
结果:
settings == { validate: true, limit: 5, name: "bar" }
示例2:
合并 defaults 和 options, 不修改 defaults。
var empty = {};
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = jQuery.extend(empty, defaults, options);
结果:
settings == { validate: true, limit: 5, name: "bar" }
empty == { validate: true, limit: 5, name: "bar" }
这个重载的方法,我们一般用来在编写插件时用自定义插件参数去覆盖插件的默认参数。
jQuery.fn.extend(object)扩展 jQuery 元素集来提供新的方法(通常用来制作插件)。
首先我们来看fn 是什么东西呢。查看jQuery代码,就不难发现。
jQuery.fn = jQuery.prototype = {
init: function( selector, context ) {.....};
};
原来 jQuery.fn = jQuery.prototype,也就是jQuery对象的原型。那jQuery.fn.extend()方法就是扩展jQuery对象的原型方法。我 们知道扩展原型上的方法,就相当于为对象添加”成员方法“,类的”成员方法“要类的对象才能调用,所以使用 jQuery.fn.extend(object)扩展的方法, jQuery类的实例可以使用这个“成员函数”。jQuery.fn.extend(object)和jQuery.extend(object)方法一 定要区分开来。
如何写一个jquery 插件
把你的插件代码包裹在上面里面,就是一个简单的插件了。(注js插件和jquery插件都是如此)还有一个问题 把你的插件包裹在 ;(function(){ })()基本上可以说是完美了。但是为了让你开发的插件应用更加广泛,兼容性更加好,还要考虑到用插件的人的一些特殊的做法,例如,有些朋友为了避免jquery和zeptojs...
如何创建一个自定义jquery插件
要使用 fn 属性创建一个新 jQuery 插件,只需要为 fn 属性分配一个插件名,并将其指向一个充当构造函数的新函数,类似于纯 JavaScript。Code 1显示了如何定义一个名为 accordion 的新 jQuery 插件,其方法是通过使用 jQuery 对象和 fn 属性,并将其分配给一个新的构造函数。Code 1:定义一个名为 ...
如何自己开发一款js或者jquery插件
1通过$.extend()来扩展jQuery 2通过$.fn 向jQuery添加新的方法 3通过$.widget()应用jQuery UI的部件工厂方式创建
jquery如何封装插件jquery封装插件的方法
1.jQuery.extend()方法有一个重载。 JQuery.extend(object),用于扩展JQuery类本身的参数,也就是说在jQuery类/naming空之间添加新的函数,或者调用静态方法。比如jQuery内置的ajax方法都是用jQuery.ajax()调用的,有点像“类名”的静态方法。方法名”。让我们也写一个jQuery.extend(object)的例子: //扩展jQuery对象本...
jQuery怎么编写插件呢?插件的格式是怎么样的?
2.1 在JQuery名称空间下申明一个名字这是一个单一插件的脚本。如果你的脚本中包含多个插件,或者互逆的插件(例如: $.fn.doSomething() 和$.fn.undoSomething()),那么你需要声明多个函数名字。但是,通常当我们编写一个插件时,力求仅使用一个名字来包含它的所有内容。我们的示例插件命名为“highlight“ Java代码 ...
如何制作JQuery Plugin 插件【插件参数的配置】
但一般情况下,力争用单一的名称来维持插件现实的所有细节。在本例中,我们将声明一个叫“hilight”的名称// 插件的定义 $.fn.hilight = function( options ){ // 这里就是插件的实现代码了... };然后我们可以像这样调用它:$("divTest").hilight(); 接受一个options参数,以便控件插件的行为$....
需要jquery插件才能运行(什么是jquery插件有什么用)
jQuery插件,运行不出来,插件无误1、你好,你好像调用了两次jQuery库,你可以把第一个库删掉。注意:在使用jQuery时必须先加载库,然后再加载插件(在有插件的情况下),最后写特效代码,注意顺序。2、首先请检查浏览器是否禁用了javascript脚本。第二打开页面后,F12,看是否有报错。3、出现这种情况,是你...
高手帮忙 Jquery 插件开发。
我不是什么高手,不过试着写了一个jquery的插件,希望能给你提供点参考 /*!jQuery alert plugin: simple alert for debugging Examples and documentation at:version 0.20 (26-MAY-2009)Dual licensed under the MIT and GPL licenses:http://www.opensource.org/licenses/mit-license.php http://...
如何编写jquery 插件 函数A调用函数B
/*编写代码*/ })();首先定义一个匿名函数function(){/*编写代码*/},然后用括号括起来,最后通过()这个运算符来执行。可以传递参数进去,以供内部函数使用。//为了更好的兼容性,开始前有个分号 ;(function($){ //此处将$作为匿名函数的形参 /*编写代码,可以使用$作为jQuery的别名*/ })(...
jquery自定义插件的问题
首先给插件设置默认参数 _default{参数1:值1,参数2:值2,……} .extend({ 方法:function(settings){ //settings就是调用的时候需要传递的参数 //参数扩展 .extend(_default,settings);//这的意思通俗点讲就是,如果settings中给参数赋了值,那就用settings中的值,如果没有就用_default的。具体...