没有在 keyup 函数中获取键码

Question

我正在尝试将 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？谁能帮我解决这个问题？提前致谢。

Answer 1

我想，您正在混合不同的东西：pure js 和 jquery。仅使用 jquery，您可以通过下面的代码片段实现您想要的效果。

$("#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);
}

<input id='testTextbox' name='testTextbox' type='text' onkeyup='testKeyUp(event)'>

Answer 2

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);
}

Answer 3

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

确保两者匹配。其次

onkeyup='testKeyUp(e)'

Answer 4

使用内联事件使这一点变得复杂。 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>

Answer 5

    $("#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

弃用

没有在 keyup 函数中获取键码

Not getting keycode in keyup function

javascript

jquery

events

onkeyup