Question

考虑以下jQuery插件代码：

(function($){
$.fn.MyPluginMethod= function() {
    $(this).after('<span>Hello</span>');
    };
})(jQuery);

如果我们这样调用这个函数：对于存在的每个 $('a').MyPluginMethod();代码，<a> 会在其后添加<span>代码。

如果我们改变它：

(function($){ $.fn.MyPluginMethod= function() { title= $(this).attr('title'); alert(title); }; })(jQuery);

不会警告每个 <a>标记的标题，仅针对第一次出现。

为什么会这样？感谢

Answer 1

这是因为您正在创建一个插件实例，因此alert()被调用一次。第一个示例在每个span之后生成a元素的原因是因为after() jQuery函数循环遍历匹配的元素集。

要让后一个示例按您的需要工作，您需要手动循环：

(function($){
    $.fn.MyPluginMethod= function() {
        this.each(function() {
            title = $(this).attr('title');
            alert(title);
        });
    };
})(jQuery);

您可以使用this.length

检查插件是否已在多个元素上实例化

Answer 2

当你打电话时会alert 同时使用$.each为多个元素（如

）调用它

<强> HTML

<div title="test">test</div>
<div title="test123">test123</div>

<强> SCRIPT

(function($){
$.fn.MyPluginMethod= function() {
    return $(this).each(function(){
      title= $(this).attr('title');
      alert(title);
    });
};
})(jQuery);
$('div').MyPluginMethod();

Updated Fiddle

阅读http://learn.jquery.com/plugins/basic-plugin-creation/

jQuery插件不适用于所有应用的元素

2 个答案: