使用ASP.NET服务器控件解决jQuery版本冲突
我正在开发一个ASP.NET服务器控件,它使用jQuery作为一些客户端逻辑。 我已将jQuery文件嵌入控件中作为资源。
我不想将使用控件的应用程序限制为特定版本的jQuery,我想继续使用我嵌入的jQuery版本。
我知道noconflict方法,但我看到的问题是我无法控制页面上脚本标签的顺序。
如果用户的jQuery版本包含在我之前,那么在我可以调用noconflict之前,我最终会覆盖它。
请帮忙
您可以使用noConflict(true)
执行此noConflict(true)
:
var myJQuery = jQuery.noConflict(true);
true
参数告诉jQuery除了$
符号之外还释放jQuery
符号。 只需将其添加到嵌入控件中的jQuery.js文件的末尾即可。
jQuery脚本对冲突很聪明。 它做的第一件事是抓住$
和jQuery
的当前值并将它们松开,以便稍后如果你要求它可以恢复它们。 因此,如果首先加载脚本,则不会定义$
和jQuery
,而新的jQuery
也可以使用它们。 如果您的脚本第二次加载,它将恢复早期的$
和jQuery
。
示例 :
假设您使用的是最新版本(v1.5.1),但页面作者使用的是旧版1.4.4。 有效地,通过添加var jq151 = jQuery.noConflict(true);
在1.5.1文件的末尾,你这样做:
…除了它们都在一个脚本标签中。 有两种可能性:
1)他们先走了:
实例
2)你先走了:
实例
无论哪种方式, jQuery
和$
都指向他们的1.4.4版本, jq151
最终指向你的1.5.1版本。
也许稍微偏离主题,但对于任何认为这有点神奇的人来说,它实际上非常容易。 :-)这是一个将重新定义foo
的脚本,但如果你要求它恢复以前的定义:
// The script (function() { var globalObject = this, // Or just use `window` on browsers oldfoo, ourfoo; oldfoo = globalObject.foo; ourfoo = globalObject.foo = { version: "new", restorePrevious: restorePrevious }; function restorePrevious() { globalObject.foo = oldfoo; return ourfoo; } })();
上面定义了foo
例子
上面介绍了foo
之后定义的示例 (如果你想知道为什么这个有效,尽管var foo
在脚本之后, 这里有一些关于读取可怜的,误解的var
)
关于插件 :您在下面询问了有关插件的信息。 插件通过将其function分配给jQuery.fn
和(在某些情况下) jQuery
上的属性来注册自己,如下所示:
jQuery.fn.makeFoo = function() { };
通过上面的内容,您可以在jQuery实例上访问makeFoo
函数(例如, $('foo').makeFoo();
)。 一个编写良好的插件将通过使用此结构确保它与noConflict()
和noConflict(true)
:
(function($) { $.fn.makeFoo = function() { $(this).addClass("foo"); }; })(jQuery);
……或者喜欢它的人。 (有了上述内容,我们永远不会在函数体中使用jQuery
来引用jQuery。如果我们想要,我们可以在顶部添加var jQuery = $;
)
它定义了一个匿名函数并立即调用它,传入jQuery
的当前全局值。 它接收它作为$
参数 ,因此在函数内,符号$
将始终是它传递给自身的jQuery
实例。 它可以自由地使用$
知道它引用了它注册的jQuery的版本。
只有一个写得很好的插件可能会假设jQuery
总是相同的(例如,只能使用noConflict()
而不能使用noConflict(true)
)。 但是你可以解决这些问题。 如果遇到一个,请复制一份并放入
(function($) { var jQuery = $;
……在顶部和
})(jQuery);
…在底部。 99%的时间,这将使其表现。
如果您想在嵌入式jQuery实例中使用插件,最好将它们包含在自定义文件中。 所以文件内容变成:
- jQuery脚本
- (插件脚本)
- (插件脚本)
- …
- 你的
var jq151 = jQuery.noConflict(true);
这是一个很好的解决方案:不要使用jQuery。 至少 – 不是一开始。 使用javascript等待所有脚本加载,存储值“$”,然后在via脚本标记中注入jQuery,并恢复之前的“$”值。