web-dev-qa-db-ja.com

テキストボックス内でEnterキーを取得して、最初のボタンやデフォルトボタンではなく機能をトリガーする方法

特定のテキストボックス内で押されたときに機能をトリガーするEnterキーを取得しようとしていますが、最初のボタンまたはデフォルトのボタンはトリガーしません。

ここで何が起こっているかの例を見ることができます： http://jsfiddle.net/cutsomeat/WZ6TM/1/

他のキーを押すと、キーコードのあるアラートボックスが表示されますが、Enterキーを押すと、キーコードのあるアラートボックスではなく、ボタンクリックイベント内のアラートボックスが表示されます。

明らかに、Enterキーがボタンをトリガーします。これを回避し、代わりに、キーアップイベントでEnterキーをキャプチャし、別の機能をトリガーする方法はありますか？

jquerybuttontextboxkeycodeenter
39
MarkieB

これを試して：

$('#myText').on("keypress", function(e) {
        if (e.keyCode == 13) {
            alert("Enter pressed");
            return false; // prevent the button click from happening
        }
});

デモ

85
sachleen

.on()が 非推奨 になったため、.live()を使用します。

$(document).on("keypress", ".myText", function(e) {
     if (e.which == 13) {
         //do some stuff
     }
});
49
Arvind Bhardwaj

KeyDownでe.preventDefault()を実行して、ボタンのデフォルトアクションを回避します。

$('#myText').keydown(function(e) {
    if (e.keyCode == 13) {
        e.preventDefault();
    }
    alert(e.keyCode);
});
21
Suraj Chandran
_$(document).ready(function() {

    $('#myText').keypress(function(e) {
        if ( e.keyCode == 13 ) {  // detect the enter key
            $('#myButton').click(); // fire a sample click,  you can do anything
        }
    });

    $('#myButton').click(function(e) {
        alert('Button click activated!');
    });

});
_

[〜＃〜] demo [〜＃〜]

ライブ要素には、以下のように .on() を使用します。

_$(document).ready(function() {

    $(document).on('keypress', '#myText', function(e) {

        if ( e.keyCode == 13 ) {  // detect the enter key
            $('#myButton').click(); // fire a sample click,  you can do anything
        }
    });

    $(document).on('click', '#myButton', function(e) {
        alert('Button click activated!');
    });

});
_
12
thecodeparadox