2

基本上，我正在使用一个现有的 jQuery 插件，我希望有 2 个可从 Jquery 使用的实例。

所以对于这个html：

<div id="div_1"></div>
<div id="div_2"></div>

我将能够做到这一点：

$('#div_1').myplugin();
$('#div_2').copy_of_myplugin();

现在 myplugin 正在由我从 html 文件顶部的外部源中提取的脚本加载。

如果我console.log($());可以看到所有本机 jQuery 方法的列表以及插件脚本添加的方法。

基本上，经过一些研究，我认为这样的事情应该可行，但我无法确切地知道如何去做。

$.fn.copy_of_my_plugin = function () {
    return this.each(function () {
        var instance = $(this);
        if (instance.data('copy_of_my_plugin')) {
            return;
        }
        var copy_of_my_plugin = new $.extend(true, {}, $.fn.myplugin);
        instance.data('copy_of_my_plugin', copy_of_my_plugin);
    });
};

我可以console.log($());再次看到 copy_of_my_plugin 被添加到 jquery 中，但看起来 myplugin 函数的任何内容实际上都没有被复制。

有人知道我做错了什么吗？

4

1 回答 1

1

很难弄清楚您要在代码中做什么。您确实意识到在您的示例中，您的变量“instance”实际上被设置为 dom 元素 id="div_2"。您是想获得同一个插件的 2 个实例，还是只是想用 2 个插件名称获得相同的功能？你确定你不只是想这样做吗？

$.fn.a_copy_of_my_plugin = $.fn.myplugin;

如果您使用代码，当您执行 console.log() 并且能够“查看您的插件”时 - 它实际上不是任何内容的副本，它只是指向您分配给 $.fn.copy_of_my_plugin 的函数的指针在你上面的代码中。只有当你这样做 $('#div_2').copy_of_myplugin(); 然后运行那个试图“创建第二个实例”的函数可以这么说。

如果您想立即运行该功能，您将替换 }; 与 }($); 作为您的最后一行代码。

正如您的代码所示， this.each 仅在您使用 $('#div_2').copy_of_myplugin(); 时运行 然后尝试在 $('#div_2') 的 jQuery 数据缓存中存储一​​个新对象的副本。

你可能想看看这个。我认为它应该做你在Best Way to Extend a jQuery Plugin之后所做的事情

于 2013-06-13T20:41:57.683 回答