没有在 keyup 函数中获取 keycode答案

【问题标题】：Not getting keycode in keyup function没有在 keyup 函数中获取 keycode
【发布时间】：2023-04-02 20:35:01
【问题描述】：

我正在尝试将 keyup 函数添加到使用 jquery 添加到 DOM 的输入字段中。

$("#testDiv").html("<input id='testTextbox' name='testTextbox' type='text' onkeyup='testKeyUp(this)'>");

一旦用户在testTextbox 中输入值并按下回车键，我想做一些操作。

keyup函数是这样的：

function testKeyUp(e) {
alert(e.keyCode+" : "+e.which);
}

e.keyCode 和 e.which 返回未定义。

如何在 keyup 函数中获取 keycode？谁能帮我解决这个问题？提前致谢。

【问题讨论】：

您正在将元素分配给您的 testKeyUp 处理程序
你在哪里调用shippingPackageKeyValueKeyUp函数？
对不起。这是一个错字。我已经编辑了问题。
尝试将event传输到eventHandler而不是this，像这样-onkeyup='testKeyUp(event)

标签： javascript jquery events onkeyup

【解决方案1】：

使用内联事件会使这件事复杂化。 e 在函数中充当this。稍微修改代码以删除内联事件会更容易，而是将其编写为：

$("#testDiv").html("<input id='testTextbox' name='testTextbox' type='text'>");

var textInput = document.getElementById('testTextbox');

textInput.addEventListener('keyup', function(e){
alert(e.keyCode+" : "+e.which);
});

或者

$("#testDiv").html("<input id='testTextbox' name='testTextbox' type='text'>");

$('#testTextbox').on('keyup', function(e){
alert(e.keyCode+" : "+e.which);
});

这是一个工作示例：

$("#testDiv").html("<input id='testTextbox' name='testTextbox' type='text'>");

var textInput = document.getElementById('testTextbox');

textInput.addEventListener('keyup', function(e){
alert(e.keyCode+" : "+e.which);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="testDiv"></div>

【讨论】：

【解决方案2】：

    $("#testTextbox").on("keyup", function(e){
    if (e.key=="Enter"){
        // Your logic here
    }
    })

    <script 
    src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
    </script>
    <input id='testTextbox' name='testTextbox' type='text' >

正如@edkeveked 上面回答的那样，但我会使用 event.key 而不是 event.keycode，作为键码，并且根据https://developer.mozilla.org/en-US/docs/Web/Events/keyup 已被弃用 p>

【讨论】：

【解决方案3】：

我猜，你在混合不同的东西：pure js 和 jquery。仅使用jquery，您可以通过下面的 sn-p 实现您想要的。

$("#testTextbox").on("keyup", function(e){
alert(e.keyCode+" : "+e.which);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id='testTextbox' name='testTextbox' type='text' >

仅使用pure Js

function testKeyUp(e){
  alert(e.keyCode+" : "+e.which);
}

&lt;input id='testTextbox' name='testTextbox' type='text' onkeyup='testKeyUp(event)'&gt;

【讨论】：

至少知道应该附加事件处理程序作为在所有浏览器中获取事件的唯一可靠方法:)

【解决方案4】：

Here 是您所需要的。

您将函数命名为testKeyUp()，函数的真实名称是shippingPackageKeyValueKeyUp(e)。你也不会得到this，而是event

JS

$("#testDiv").html("<input id='testTextbox' name='testTextbox' type='text' onkeyup='testKeyUp(event)'>");

function testKeyUp(e) {
alert(e.keyCode+" : "+e.which);
}

【讨论】：

【解决方案5】：

首先我注意到事件处理程序的函数名称与 onkeyup 回调名称不匹配。

确保两者匹配。其次

onkeyup='testKeyUp(e)'

【讨论】：