Question

我在编写jQuery插件，阅读文档，搜索帖子等方面已经工作了好几个小时。有一点尚不清楚。我正在编写一个包含多个实例的插件，所以我有类似的东西

<div id="box1" class="box"></div>
<div id="box2" class="box"></div>

<script type="text/javascript">
    $(".box").myPlugin();
</script>

因此插件将作用于两个DOM元素。这是一个插件演示。假设我需要一个或多个私有变量（演示中的myValue），当然任何实例（box1，box2）都有不同的值。

(function ( $ ) {

    $.fn.myPlugin = function() {

        this.each(function() {

            /* this is a private variable */
            var myValue = Math.floor(Math.random() * 10000);
        });  

        return this;
    };

    /* this is a public method */
    $.fn.myPlugin.showValue = function() {
        alert('My value is ' + myValue);
    };

}( jQuery ));

现在我需要这个插件来公开一个公共方法来读/写这样的私有变量。当然，上面的代码将失败，“myValue is undefined”错误。

我需要以某种方式获取对任何实例的引用，然后调用“他们的”公共方法。像

这样的东西

$（'＃box2'）。showValue（）/ * ??? * /

任何帮助都将不胜感激。谢谢。

Answer 1

不幸的是，如果不简单地定义额外的＆＃34;插件＆＃34;在$.fn namespace上。

通常，插件的方法可以作为传递给插件的参数实现：

$("foo").myPlugin(); // initialize
$("foo").myPlugin("doSomething"); // do something

或通过拥有＆＃34;实例＆＃34;对象可用：

$("foo").myPlugin(); // initialize
var inst = $("foo").data("myPlugin"); // get instance
inst.doSomething(); // do something

可以在此处找到第一个选项的示例：http://learn.jquery.com/plugins/basic-plugin-creation/

编写一个jQuery插件：公共方法和多个插件实例

1 个答案: