7

我制作了一个组合框插件。要使用它，您只需调用

$(elem).combobox(compensateElement);

编辑：问题是，如果你这样做

$('#1').combobox('form');
$('#2').combobox('form');

插件会坏...

elem 是要变成组合框的 select，compareElement 是一个元素，插件可以在其后插入一个 div，该 div 的长度是SuggestionsDiv-20px 高。（我的页面上有一个没有被绝对定位元素向下推的页脚......）

现在，问题是这个插件只能在一个元素上使用！如何更改它以便它可以同时处理多个元素？这是一百多行 JS 代码，所以我不指望“转换”的代码！

我曾考虑将所有特定于元素的变量放入 this.data “对象”中，但感觉根本不是一个好的解决方案。在上面运行了一些 RegEx 查找和替换并配置了几个小时后，我根本没有让它工作......

我可以使用哪些技术？

非常感谢您的宝贵时间！

4

2 回答 2

12

问题是您有一个文字对象，每次调用时都会替换他的内容m.init()。

我建议你看看这篇文章，它解释了编写 JQuery 插件的好方法。如果你看到“轻量级启动”，例如：

$.fn[pluginName] = function ( options ) {
        return this.each(function () {
            if (!$.data(this, 'plugin_' + pluginName)) {
                $.data(this, 'plugin_' + pluginName,
                new Plugin( this, options ));
            }
        });   
    }

这将为每个元素创建一个插件对象的新实例，因此您可以始终如一地保持状态。

于 2012-11-30T15:16:48.857 回答
0

您可以使用 jQuery 的 each 函数在每个元素上调用插件方法。请记住，在您的方法中，关键字this将指向当前元素而不是 jQuery 对象。 

   $.fn.combobox = function(form) {
        var $this = this;

        return $this.each(function () {
             if (!m.initialized) {
                m.init.apply(this, [form]);
                $this.data('initialized', true);
             } else {
                m.updateList.apply(this);
             }
        });
    };
于 2012-11-30T15:09:08.730 回答