Question

我正在使用jquery创建一个非常简单的富文本编辑器...我不想使用第三方。

我需要在iframe（同一个域等）中监听事件，从键入开始。显然我需要经常使用bind（）。

这就是我目前在IE8中工作得很好（令人惊讶的是）但不是Chrome。

<script>
$(function() {
    $('#text').contents().bind("keyup keydown keypress", function(e) {
        var code = e.keyCode || e.which;
        alert(code);
        return false;
    });
});
</script>

<body>
    <iframe id="text" name="text" src="edit.html"></iframe>
</body>

在上面的按键事件中，我还想获取'edit.html'的当前值并使用该值更新textarea ...

任何帮助都会非常感激：）

非常感谢

编辑：要进一步解释，edit.html是使用"document.body.contentEditable = true;"

的可编辑文件

-

编辑2：

edit.html =

<script language="javascript">
    function InitializeIFrame() {
        document.body.contentEditable = true;                         
    } 

</script>
<html>
<body onload="InitializeIFrame();">

</body>
</html>

Answer 1

当我尝试与iframe（同一个域等）进行通信时，我似乎记得遇到问题。我发现的技巧是在框架内进行绑定并绑定到主窗口中的函数。像这样的东西（在edit.html中）：

<script>
$('body').bind("keyup keydown keypress", function(e) {
  window.parent && window.parent.funcKey && window.parent.funcKey(e);
});
</script>

然后在主页面中：

<script>
function funcKey(e) {
  var code = e.keyCode || e.which;
  alert(code);
  return false;
}
</script>

我意识到这并不完全符合您尝试的方式，但实现了相同的效果。根据我对javascript和iframe的理解，在实践中，与父母沟通比与iframe沟通更容易。如果你真的需要双向通信，你可以（在上面的例子中）使用函数funcKey（）的返回值将数据传回iframe。

Answer 2

关于javascript最令人讨厌的事情之一是document.frames [＆＃34; frameID＆＃34;]返回与document.getElementById不同的对象（＆＃34; frameID＆＃34;）。（这是你使用$（＆＃34;＃frameID＆＃34;）时得到的）

这种区别可能是您遇到跨浏览器问题的原因。您可能需要使用不同的方式访问iframe内容，直到找到正常工作的方式。

jquery在iframe中侦听事件

2 个答案: