jQuery 2.0.3 bug-fadeIn(),show()在firefox中损坏-SecurityError:操作



我有一个非常基本的html元素,我想fadeIn()。然而,我正在使用require.js,所以我相信这可能是问题的一部分。我使用的是jQuery 2.0.3当使用fadeIn时,我会收到以下错误:

SecurityError: The operation is insecure.
chrome://firebug/content/console/commandLineExposed.js
Line 5

我以前从未见过这种情况,我已经重置了firefox和我的电脑

Html

<message-box>
<message-info></message-info>
<close-box>x</close-box>
</message-box>

JS

$('message-Box').fadeIn(); 

我只在firefox v27中得到这个错误。没有其他浏览器有这个问题,但我还没有在任何旧版本的FF中测试过它

除了这个错误,我不寻求任何帮助。。。

看到错误了吗?并运行此命令:SD.message.showMessage('Somehow this breaks everything', 'bad');

-----编辑-------

很遗憾,你需要测试这个。在这里,我向你保证这是SFW,它只是登录页面。

我确信我的其他JS文件中一定有冲突的内容,但我还没有发现问题。

我移走了一把小提琴,因为它对这个问题毫无帮助,因为加上赏金,我希望它尽可能有帮助。

第二次编辑

奇怪的是,当运行任何show(), hide(), fadeIn()等时,都会在页面底部、正文之前创建一个iframe。我需要在我的代码中思考为什么会发生这种情况。

第三次编辑

我对此没有任何理由或解释,但更新到jQuery 2.1.0已经解决了我的问题。如果有人能解释这个问题,那么我很乐意给他们打分:)

通过jQuery代码,您最终会找到下面的内部函数。当jQuery尝试写入iframe文档时,会引发安全错误。jQuery 2.1.0有一种不同的方法来确定默认节点显示值,因此您可以将其视为jQuery/浏览器组合错误。您可以通过将以下内容粘贴到控制台来最低限度地重新创建安全错误:

var iframe = jQuery("<iframe frameborder='0' width='0' height='0'/>").css( "cssText", "display:block !important" ).appendTo(document.documentElement);
iframe[0].contentWindow.document.write("<!doctype html><html><body>");

内部jQuery功能:

function css_defaultDisplay( nodeName ) {
var doc = document,
display = elemdisplay[ nodeName ];
if ( !display ) {
display = actualDisplay( nodeName, doc );
// If the simple way fails, read from inside an iframe
if ( display === "none" || !display ) {
// Use the already-created iframe if possible
iframe = ( iframe ||
jQuery("<iframe frameborder='0' width='0' height='0'/>")
.css( "cssText", "display:block !important" )
).appendTo( doc.documentElement );
// Always write a new HTML skeleton so Webkit and Firefox don't choke on reuse
doc = ( iframe[0].contentWindow || iframe[0].contentDocument ).document;
doc.write("<!doctype html><html><body>");
doc.close();
display = actualDisplay( nodeName, doc );
iframe.detach();
}
// Store the correct default display
elemdisplay[ nodeName ] = display;
}
return display;
}

根据规范,自定义元素的标记中应该有"-",因此您的标记应该如下所示:

<message-box>
<x-message><div></div></x-message>
<x-close>x</x-close>
</message-box>

在更改和相应的样式更新之后,据我所知,它是有效的:http://jsfiddle.net/9Frn8/11/

看起来这可能是由于CSS文件中的绝对路径造成的。我还看到(在控制台中)您正试图调用localhost(当然失败了)。您的代码中似乎存在一些问题,导致Firefox停止特定进程。具体来说,firefox认为是跨领域的。

这很可能是同源政策问题。

最新更新