将事件处理程序添加到 iframe 以在 keyup 上调用答案

【问题标题】：Adding event handler to iframe to invoke on keyup将事件处理程序添加到 iframe 以在 keyup 上调用
【发布时间】：2023-03-16 13:48:01
【问题描述】：

在我有 iframe 的网页上，我在其中显示了一些内容。
如果在 iframe 中按下任何键，我想运行一个函数（iframe 是可编辑的）。

我可以使用 ajax（页面上有 scriptmanager）来做到这一点：

Sys.UI.DomEvent.addHandler(document.getElementById('iframe1').contentWindow.document, 'keyup', iframeKeyHandler);

但我想不用ajax！

更新代码：

function Init() {
    document.getElementById('iView').contentWindow.document.designMode = "on";       

     document.getElementById('iView').contentWindow.document.onkeyup = function(event) {
       alert(event);
     }    
 }

<body onload="Init()" >   
<iframe id="iView" style="width: 434px; height:371px" ></iframe>
</body>

【问题讨论】：

标签： javascript ajax

【解决方案1】：

我猜你的意思是“不使用脚本管理器”？

你可以这样做（使用attactEvent/addEventListener）：

<html>
<head>
<script type="text/javascript">
function Init() {
    var _win = document.getElementById("iView").contentWindow;
    var _doc = _win.document;
    _doc.designMode = "on";
    if(_doc.addEventListener) {// if support addEventListener
        _doc.addEventListener("keyup", frameKeyUp, true)
    }
    else { //For IE
        _doc.attachEvent("onkeyup", frameKeyUp);
    }
}
function frameKeyUp(e){
    alert(e.keyCode);
}
</script>
</head>
<body onload="Init()" >   
<iframe id="iView" style="width: 434px; height:371px"></iframe>
</body>
</html>

或者使用 jQuery 的 event handler 表示“keyup”：

$('#iframe1').keyup(function(event){
  //... do your stuff here ..
  //use event.keyCode to get the asscoiated key
});

有关键盘事件 arg 的更多信息可以在 here 和 here 找到。

【讨论】：

我怎样才能知道按下了什么键？
我得到的肯定是我做错了什么：'event.keyCode' 为空或不是对象
虽然对我有用。想用更新后的代码更新您的帖子吗？
完成，还要注意我需要 iframe 的 contentWindow.document 的关键事件
@kenny：我已经修改了我的代码以适应你的。 keyup 方法在浏览器之间没有一致的行为，我认为使用 attachEvent (IE) 和 addEventListener (others) 会更干净。我真的推荐使用 jQuery，这里有一个相关的帖子：stackoverflow.com/questions/549488/…