避免jQuery和jQuery扩展中的冲突！ [英] Avoiding conflicts in jQuery and jQuery extensions !

问题描述

我在CMS扩展中使用jQuery和一些非常常见的jquery-plugins(包括jQueryUI和jQueryTools以及许多其他插件)，在许多情况下，很多人都在使用CMS扩展.我总是遇到扩展程序的插件与同一CMS页面上另一个扩展程序添加的插件之间存在冲突的问题.有时，其他扩展程序会加载早期版本的jQuery插件，并杀死我的实例.

I'm using jQuery and some very-common-jquery-plugins in CMS extensions (including jQueryUI and jQueryTools along with many others) in some CMS extensions that are used by many people in a wide array of situations. I always get into issues where there are conflicts between my extension's plugins and plugins added by another extension on the same CMS page. Sometimes the other extension loads an earlier version of the jQuery plugin and it kills my instance.

我想将扩展使用的所有插件重命名"或包装"(合并为一个具有唯一名称的插件)，这样即使有其他相同实例，我的实例也不会受到任何影响插件在同一页面上.

I want to "rename" or "wrap" (into a single plugin with a unique name) all the plugins that my extensions use so my instance doesn't get affected in any way even when there are other instances of the same plugins on the same page.

如果可能的话，将所有插件包装到单个插件中将是理想的解决方案-而不是重命名.

Wrapping all plugins into a single plugin would be the ideal solution, if that's possible - instead of renaming.

任何建议，这有可能吗?

Any suggestions, Is this even possible ?

感谢一堆， 诺曼.

推荐答案

您可以将插件包装在匿名函数中，并使用特定版本的jquery对其进行调用.

You can wrap plugins in an anonymous function and call them with the specific version of jquery.

示例:

<script src="jquery-1.3.js"></script>
<script>
  $jq13 = jQuery.noConflict(true);
</script>

<script src="jquery-1.4.js"></script>
<script>
  $jq14 = jQuery.noConflict(true);
</script>

<script>
  (function($){
    // All references to $ in this block will refer to $jq14
    // Put plugins inline here
  })($jq14);
</script>

写得很好的插件已经用这种方式编写了，所以您只需更改最后一行即可设置应使用的jquery对象.

Well written plugins will already be written this way, so you can just change the last line to set which jquery object it should use.

或者您可以在调用每个插件之前更改window.jquery.像这样:

Or you could change window.jquery before calling each plugin. Like this:

<script src="jquery-1.3.js"></script>
<script>
  $jq13 = jQuery.noConflict(true);
</script>

<script src="jquery-1.4.js"></script>
<script>
  $jq14 = jQuery.noConflict(true);
</script>

<script>
  window.jQuery = $jq14;
</script>
<script src="some_plugin.js"></script>

<script>
  window.jQuery = $jq13;
</script>
<script src="some_other_plugin.js"></script>

不太优雅，但应该可以.

A little less elegant, but it should work.

这篇关于避免jQuery和jQuery扩展中的冲突！的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！