我正在向其他站点提供Javascript小部件,并且我在小部件中使用Jquery似乎与主机站点使用Prototype相冲突。JS小部件(使用Jquery)与主机页上的Prototype冲突
这里你可以看到在行动的冲突: http://www.phillyrealestateadvocate.idxco.com/idx/8572/results.php?lp=100000&hp=500000&sqFt=0&bd=2&ba=0&searchSubmit=&city%5B%5D=131
在页面的右边,点击绿色的“提问”按钮 - 这将产生一个弹出式窗口,只要你打开弹出窗口,“无效数组长度”错误开始滚动到JS控制台(并且不停止)。弹出窗口然后无法关闭,但仍然可拖动。弹出窗口中的代码/内容位于iframe中,所以它仍能正常工作,但弹出窗口不会关闭。
Firebug给我的错误是: invalid array length
在Prototype.js中,但是当我展开详细信息时,它引用了jquery.min.js,所以这让我相信这两者是冲突的。
我的窗口小部件的代码完全是在一个匿名函数,并使用负载Jquery的亚历克斯Marandon这里描述的模型: http://alexmarandon.com/articles/web_widget_jquery/
我使用的是noConflict电话,但也许它不工作,我把它的方式吗?
这里是我的插件脚本的开始它包含jquery.min.js和jQueryUI的参考文献:
(function() {
// Localize jQuery variable
var jQuery;
/******** Load jQuery if not present *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.6.2')
{
var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src",
"http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js");
script_tag.onload = scriptLoadHandler;
script_tag.onreadystatechange = function() { // Same thing but for IE
if (this.readyState == 'complete' || this.readyState == 'loaded') {
scriptLoadHandler();
}
};
// Try to find the head, otherwise default to the documentElement
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
}
else
{
$.getScript("https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js" ,
function()
{
// The jQuery version on the window is the one we want to use
jQuery = window.jQuery;
main();
}
);
}
/******** Called once jQuery has loaded ******/
function scriptLoadHandler()
{
$.getScript("https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js" ,
function()
{
// Restore $ and window.jQuery to their previous values and store the
// new jQuery in our local jQuery variable
jQuery = window.jQuery.noConflict(true);
main();
}
);
}
/******** Our main function ********/
function main()
{
// Do a bunch of stuff here
}
})(); // We call our anonymous function immediately
任何帮助,将不胜感激!
编辑:我现在有直接在窗口小部件中的Jquery UI,所以我完全取消了getScript调用。不幸的是,这并没有解决冲突。下面是新的代码:
(function() {
// Localize jQuery variable
var jQuery,
/******** Load jQuery if not present *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.6.2')
{
var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js");
script_tag.onload = scriptLoadHandler;
script_tag.onreadystatechange = function() { // Same thing but for IE
if (this.readyState == 'complete' || this.readyState == 'loaded') {
scriptLoadHandler();
}
};
// Try to find the head, otherwise default to the documentElement
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
}
else
{
jQuery = window.jQuery;
main();
}
/******** Called once jQuery has loaded ******/
function scriptLoadHandler()
{
jQuery = window.jQuery.noConflict(true);
main();
}
/******** Our main function ********/
function main()
{
所以我只是试过这个,但现在Firebug说jQuery没有定义(在noConflict行) – Wemmick
你的加载程序有缺陷,更新答案来解决这个问题。 –
在同一行上仍然出现相同的错误:\ – Wemmick