Question

我（和许多其他人一样）正在尝试清理我粘贴到contentEditable iframe中的文本。我没有使用jQuery（它是一个非常古老的代码库），并且处理程序是这样附加的：

if (isIE) {
  iframe.attachEvent("onpaste",handler);
}
else {
  iframe.addEventListener("paste",handler,true);
}

这适用于Firefox和Opera，但在IE 10和最新版本的Chrome（29.0.1547.62）中，从不调用处理程序;我在处理程序的第一行放置了一个断点，但是当粘贴我的某些文本时它没有到达断点并且粘贴的文本刚出现（未经过清理）。我尝试在IE 9模式下使用IE10，它没有任何区别。其他处理程序似乎按预期调用。

有没有人知道这里会发生什么？

... TIA

Answer 1

事实证明，iframe加载了一个空白页面，然后以编程方式填充内容。在重写iframe文档之前添加了事件侦听器，这就是问题的原因。在重写iframe内容之后，需要添加侦听器。这是一个测试用例：

<html> <head> <title>Paste test&</title> <script> function handler() { alert("Paste"); } function register(iframe) { // // IE10 requires addEventListener to be used, so this // is preferable to doing browser detection... // if (window.addEventListener) { iframe.addEventListener("paste",handler,true); } else { iframe.attachEvent("onpaste",handler); } } function test() { var iframe = document.getElementById("frm").contentWindow; try { var doc = iframe.document; if (!doc) { setTimeout(test,50); return; } // register(iframe); // this won't work! doc.open(); doc.write("<html><body>Paste text here: []</body></html>"); doc.close(); doc.body.contentEditable = true; register(iframe); // this works! } catch (e) { setTimeout(test,50); return; } } </script> </head> <body onLoad="test()"> Here is the iframe: <p> <iframe id="frm" src="blank.html" width="400" height="200"></iframe> </body>

Answer 2

我猜您的iframe引用了主页上的iframe元素（尽管在这种情况下，即使在FF23中我也无法完成此工作）。您可以使用跨浏览器方式来引用window中的iframe对象：

HTML：

<iframe name="iframe" ...></iframe>

JS：

var iframe = window.frames['iframe'];
if (window.addEventListener) {
  iframe.addEventListener('paste', handler);
}
else {
  iframe.attachEvent('onpaste', handler);
}

另请注意功能检测，而不是浏览器检测。

Chrome的内容，我不确定，我无法在本地测试代码，因为-allow-access-to-files看起来在Chrome29中不起作用。

Chrome＆amp; IE：onpaste事件没有解雇？

2 个答案: