两个jQuery插件之间的冲突？

Question

我正在为一个客户端网站开发几个 jQuery 插件，这些插件将允许设置表单元素的样式，例如单选、复选框和选择。我一直在将它们开发为同一个文件中的三个独立插件，虽然收音机和复选框插件似乎可以很好地协同工作，但我选择的一个给我带来了麻烦，因为它似乎停止了收音机和复选框的工作！如果我删除它，其他两个会再次正常工作。

我认为他们之间存在某种冲突，但我不确定它可能在哪里。如果我注释掉除了其“设置”声明之外的所有选择插件的代码，则收音机和复选框被破坏。如果我删除设置，收音机和复选框会再次开始工作，所以似乎冲突在设置中。

我已经在所有三个中声明了相同的插件选项（只是使用它们自己的默认值）：

jQuery.fn.ioFormSelect = function(options) {
    //Default options.
    settings = jQuery.extend({
        'maxOptions': 8,
        'fieldClass': 'ui-field-select',
        'selectedClass': 'ui-field-selected',
        'openClass': 'ui-field-select-open',
        'closeClass': 'ui-field-select-close',
        'disabledClass': 'ui-field-disabled',
        'optionClass': 'ui-field-option',
        'optionGroupClass' : 'ui-field-option-group'
    }, options);

    //Plugin code

});

我做错了什么？我认为以这种方式声明的变量是“本地”的，而“全局”是由“var”这个词预先定义的。我是否必须为每个插件设置一个单独的设置变量？ :S 非常感谢您的任何建议。 :)

Answer 1

您在这里缺少一个关键字var，如下所示：

var settings = jQuery.extend({

如果没有var，您将创建一个名为settings 的全局 变量，当多个插件尝试使用它时，如果您不使用它，这当然会导致问题打算分享它:)

例如you can test it like this:

​$("body").ioFormSelect();
alert(window.settings.maxOptions);​​​ //alerts "8"

本题有更详细的讨论：Difference between using var and not using var in JavaScript