如何处理jQuery命名空间冲突的好方法/最佳方法？

Question

我正在使用两个jQuery插件。两个插件都扩展了jQuery，具有原型函数removeTag。这导致第二个加载的插件能够正常工作，而第一个插件无法正常工作。

为了快速修补，我将第二个插件中的removeTag及其所有调用重命名为其他名称。

显然，这不是一个好的解决方案。升级需要手动编辑，并且可能存在其他命名空间冲突，我还没有意识到。

有人可以推荐一些有效的策略来处理这个问题吗？

我正在使用的两个插件是：

- jQuery TagIt- http://aehlke.github.com/tag-it/ - jQuery TagsInput - https://github.com/xoxco/jQuery-Tags-Input

- Jonathan Vanasco

---

两个jQuery库或两个jQuery插件。这之间有很大的区别。如果是两个jQuery库，removeTag并不是唯一会冲突的东西。 - Kevin B

什么是库？如果你的命名空间已经命名，那么你不能调用命名空间版本的removeTag（不确定我是否说对了）。或者你可以给它一个名称，而不是修改命名空间内的单个方法？ - Marc

你可能会有幸将HTML文档中库/脚本的调用反转，并将它们放在最后的 </body> 标签之前。 - Roko C. Buljan

作为最后的手段，你可以使用 noConflict，但这需要你加载两次 jQuery。更不用说要为 jQuery 使用两个不同的别名，在每个调用中使用正确的别名。 - James Montagne

抱歉造成困惑。有两个插件。将进行编辑... - Jonathan Vanasco

Answer 1

您可以使用以下代码添加一个js文件：

if (jQuery) {
    jQuery.namespace = function(namespace) {
            var names = namespace.split(".");
            var parent = window;
            for (var index = 0; index < names.length; index++) {
                    if (!parent[names[index]]) {
                            parent[names[index]] = function() {
                                    throw "Namespace, Cannot instantiate";
                            }
                    }
                    parent = parent[names[index]];
            }
    }

您可以在脚本中像以下这样使用它:

$.namespace("Somejs.MyCustomjs");

后续的代码引用完整命名空间，如：

SomeJs.MyCustomjs.myFunc();

希望这能有所帮助。

编辑：我忘了提到，你在声明js类时需要使用完整的命名空间。

- Eduardo Crimi

Answer 2

在加载第一个插件后，使用不同的名称定义函数$.fn.removeTagsPlugin=$.fn.removeTags，然后当您加载第二个插件时，它可以愉快地覆盖$.fn.removeTags。这有限制...如果第一个插件在内部使用removeTags，并且如果它使用新插件版本的removeTags，则它将无法正常工作，则此解决方案将无法正常工作。

- DanRedux

Answer 3

一种可能的方法是使用jQuery.sub()。

http://api.jquery.com/jQuery.sub/

这将允许您创建 jQuery 对象的副本，并使一个插件使用该副本。

// load jQuery
// load plugin1

var $origJQ = jQuery;
jQuery = jQuery.sub();

// load plugin2

jQuery.plugin2Stuff();
$origJQ.plugin1Stuff();

然而，一个大的缺点是在处理任何插件时需要确保使用适当的jQuery别名。如果这些插件中至少有一个只是页面加载时调用一次的东西，那么这可能不是一个问题。

编辑：显然，这在1.7中已被弃用，并将在1.8中移至插件中。

- James Montagne