为什么这两种方式编写jQuery插件等价？
第一种方式：
$.fn.myplugin = function () {
return $(this).each(function() {
return $(this).bind('click',function () {
console.log('Hi');
});
});
};
第二种方式：
$.fn.myplugin = function () {
return this.bind('click',function () {
console.log('Hi2');
});
};
解决方法
让我们从一个减少到另一个：
$.fn.myplugin = function () {
return $(this).each(function() {
return $(this).bind('click',function () {
console.log('Hi');
});
});
};
当你启动你的函数时,这是一个jQuery对象,所以$(this)不会给你买任何东西,它很容易变成：
$.fn.myplugin = function () {
return this.each(function() {
return $(this).bind('click',function () {
console.log('Hi');
});
});
};
所以你说“对于jQuery对象中的每个元素,创建一个jQuery对象并将事件绑定到该对象.”
如果你查看bind,它会调用,执行一些逻辑并最终执行此行：
return this.each( function() {
jQuery.event.add( this,types,fn,data,selector );
});
这意味着它将把事件应用于该jQuery对象中的每个元素,所以你实际上是在说：
所以你要说的是“对于jQuery对象中的每个元素,创建一个jQuery对象,并为该jQuery对象中的每个元素将事件绑定到该元素.”
您现在循环两次,一次在N个元素的列表中,然后在1个元素的列表中循环N次.你实际上可以直接绑定所有：
$.fn.myplugin = function () {
return this.bind('click',function () {
console.log('Hi2');
});
};
当然,这是最终的代码.
