javascript - 静态变量作为计数器

Question

我正在编写一个 jQuery 插件，需要跟踪页面上使用该插件的对象数量。有没有办法在插件中创建一个跟踪自身实例的静态变量？

这是我到目前为止的插件：

(function ($) {
    $.fn.my_plugin = function (options)
    {
        var plugin_count = 0;

        return this.each(function() {
            alert(++plugin_count);
        });
    }
}(jQuery));

在我的页面上：

<div class="plugin_div"></div>
<div class="plugin_div"></div>
<div class="plugin_div"></div>
<div class="plugin_div"></div>

<script language="javascript">
    $('.plugin_div').my_plugin();
</script>

当页面加载时，我收到四个警报，显示“1”。

我怎样才能写这个，以便变量为每个调用的元素递增my_plugin()？

编辑：修复了错误的复制粘贴工作。

Answer 1

你可以这样做：

(function ($) {
    $.fn.my_plugin = function (options)
    {
        $.fn.my_plugin.count = $.fn.my_plugin.count || 0;

        return this.each(function() {
            alert(++$.fn.my_plugin.count);
        });
    }
}(jQuery));

或者不要使用$.fnbut$.my_plugin.count这样您也可以将插件的默认值定义为：

$.my_plugin = {
    count : 0,
    defaults : {}
};

// Extend options with plugin defaults!
$.extend(options, $.my_plugin.defaults); 

Answer 2

在 JavaScript 中，函数是一流的对象，因此您可以在它们上存储任意属性，例如$.fn.my_plugin.whatever

当然，如果您可以在不重复函数名称的情况下执行此操作会更好 - 但arguments.callee已弃用，因此您必须继续使用完整的函数名称。

Answer 3

只需将“plugin_count”的声明移到函数外部：

(function ($) {
    var plugin_count = 0;

    $.fn.my_plugin = function (options)
    {
        return this.each(function() {
            alert(++plugin_count);
        });
    }
}(jQuery));

这在由外部匿名函数调用形成的闭包中捕获“plugin_count”。当闭包将为您执行此操作时，无需将计数维护为任何显式对象的属性。