如何将两种不同类型的事件附加到同一元素

how to attach two different types of events to the same element

本文关键字：元素 事件 两种 同类型      更新时间：2023-09-26

我对js很陌生，从逻辑上讲，我可能会以错误的方式解决这个问题。 如果有人单击按钮或按回车键，我正在尝试关闭我的自定义警报对象。 但我无法让它工作。

document.getElementById('dialogboxfoot').innerHTML = '<button id="OK" type="button" onkeypress="if (window.event.keyCode == 13){Alert.ok()}" onclick="Alert.ok()">OK</button>';

对于工作正常的文本字段，我有一些类似的东西。 这两者之间有什么区别？ 我知道内联操作很混乱，但它适用于单个 wordpress 页面。

document.getElementById('dialogboxbody2').innerHTML = '<form><input type="text" id="zipcode" maxlength="5" onkeydown="if (event.keyCode == 13){Alert.checkZip()}" autofocus /></form>';

更新：我尝试了以下方法，但它仍然没有触发 onkeypress 事件。

<button id="OK" type="button" onkeypress="key13(event)" onclick="Alert.ok()">OK</button>  
this.key13=function(event){
                  var x = event.which || event.keyCode;
                  if (x == 13){
                    Alert.ok();
                  }
                }

这是代码笔 http://codepen.io/enielsen0001/pen/XJxGaq 的链接

我不能感谢你们所有人。

在第一个示例中，您似乎正在尝试执行window.event.keyCode，而在第二个（有效）event.keyCode中。

按钮事件"按键"在聚焦后工作。

（在"单击"按钮后尝试"输入"，您会看到它有效。

属性设置并返回当前元素的 onKeyPress 事件处理程序代码。

onkeypress MDN

var c = document.getElementById('dialogboxfoot')
c.innerHTML = '<button id="OK" type="button" style="width:100px;height:100px;" onkeypress="key13(event)" onclick="alert(true);">OK</button>';
function key13(event){
  var x = event.which || event.keyCode
  if (x == 13){
    alert('key press "Enter" after focus button" ');
  }
}
<div id="dialogboxfoot" style="background:#CCC; width:300px;height:300px;"></div>

相关文章：