我试图嵌入一个使用jQueryUI的Web应用程序我进入第三方网站。我的web应用程序使用jQuery & jQueryUI(主要用于自动完成和一些较小的事情)。第三方网站也使用两者。运行两个版本的jQuery和两个版本的jQueryUI
我的代码假设jQueryUI的最新版本。第三方网站可能包含更旧的版本。
我有什么选择?我看到有关jQueryUI can be loaded twice或can only be loaded once的报告有冲突。然而,this SO question表明,如果jQueryUI是用'CONTEXT'构建的,但我找不到任何'CONTEXT'的含义。
在这里,在大纲是我想要做的事:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<!-- Some version of jQuery and jQueryUI - may change -->
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.18/jquery-ui.min.js"></script>
</head>
<body>
<script type="text/javascript">
// some third-party jQuery & jQueryUI stuff here
</script>
<!-- Up to this point, I cannot make any changes to the code, as all of the above is third-party code -->
<!-- Start of MY application -->
<!-- Load jQuery and jQueryUI -->
<script src="/jquery-ui-1.10.4.custom/js/jquery-1.10.2.js"></script>
<script src="/jquery-ui-1.10.4.custom/js/jquery-ui-1.10.4.custom.js"></script>
<!-- Application code, which wants to use jquery-1.10.2 and jquery-ui-1.10.4 -->
<input name="foo" />
<script language="javascript" type="text/javascript">
alert('START OF AUTOCOMPLETE jQuery version: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
function addAutocomplete (inputElement, options) {
// Run on document ready
$(function() {
alert('WITHIN CODE: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
<!-- *** Currently this gives "WITHIN CODE: 1.7.1; jQueryUI version: 1.8.18" -->
<!-- *** But what I want is WITHIN CODE: 1.10.2; jQueryUI version: 1.10.4" -->
})
};
addAutocomplete('foo');
</script>
<!-- End of MY application -->
<!-- From this point, I cannot make changes to the code - is third-party code which could include jQuery/jQueryUI code potentially -->
</body>
</html>
我有哪些选择?我正在把我的头发撕掉!
1)我已经试过重新分配$
和jquery
,作为建议on this page,但我不明白为什么在***的代码显示了旧版本jQueryUI的的:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<!-- Some version of jQuery and jQueryUI - may change -->
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.18/jquery-ui.min.js"></script>
</head>
<body>
<script type="text/javascript">
// some third-party jQuery & jQueryUI stuff here
</script>
<!-- Up to this point, I cannot make any changes to the code, as all of the above is third-party code -->
<!-- Start of MY application -->
<script type="text/javascript">
alert('START jQuery version: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
var oldJQuery = jQuery;
var oldDollar = $;
</script>
<script src="/jquery-ui-1.10.4.custom/js/jquery-1.10.2.js"></script>
<script src="/jquery-ui-1.10.4.custom/js/jquery-ui-1.10.4.custom.js"></script>
<script type="text/javascript">
alert('REPLACED jQuery version: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
</script>
<!-- Application code, which wants to use jquery-1.10.2 and jquery-ui-1.10.4 -->
<input name="foo" />
<script language="javascript" type="text/javascript">
alert('START OF AUTOCOMPLETE jQuery version: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
function addAutocomplete (inputElement, options) {
// Run on document ready
$(function() {
alert('WITHIN CODE: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
<!-- *** Currently this gives "WITHIN CODE: 1.7.1; jQueryUI version: 1.8.18" -->
<!-- *** But what I want is WITHIN CODE: 1.10.2; jQueryUI version: 1.10.4" -->
})
};
addAutocomplete('foo');
</script>
<script language="javascript" type="text/javascript">
// var rnSDJQ = jQuery;
window.jQuery = oldJQuery;
window.$ = oldDollar;
alert('AFTER jQuery version: ' + $.fn.jquery + '; jQueryUI version: ' + $.ui.version);
</script>
<!-- End of MY application -->
<!-- From this point, I cannot make changes to the code - is third-party code which could include jQuery/jQueryUI code potentially -->
</body>
</html>
这种方法看起来很相似到this但我认为只适用于jQuery - jQueryUI显然是doesn't have a similar noConflict方法。
2)重写我的应用程序代码,只承担jQuery和jQueryUI的早期版本?
3)作出jQueryUI的副本和做搜索和替换上(jquery)
的建议here - 听起来很讨厌,而且维护的噩梦!
4)喜欢的东西this? (虽然我不能看到如何应用它在我的情况,因为我不能推测调用noConflict第一jQuery的?)
5)其他一些选项?
另一个困难是我无法找到一种有条件地包含jQuery/jQueryUI的方法 - 第三方网站可能实际上并未加载jQuery/jQueryUI,因此我需要应对这种可能性。
你看过noConflict吗? –
@PWKad正如上面为(4)建议的链接?我不完全明白如何将这一点应用于我的情况。 – fooquency
@fooquency检查我的答案 – redV