371

form2つのテキストボックスがあり、1つは選択ドロップダウン、もう1つはラジオボタンです。enterキーを押すとJavaScript関数を呼び出したいのですが、押すと送信formされます。

キーが押されformたときにが送信されないようにするにはどうすればよいですか？enter

4

20 に答える 20

466 
if(characterCode == 13)
{
    return false; // returning false will prevent the event from bubbling up.
}
else
{
    return true;
}

では、フォームに次のテキストボックスがあると想像してください。

<input id="scriptBox" type="text" onkeypress="return runScript(event)" />

エンターキーが押されたときにこのテキストボックスから「ユーザー定義」スクリプトを実行し、フォームを送信しないようにするために、サンプルコードを次に示します。この関数はエラーチェックを行わず、ほとんどの場合IEでのみ機能することに注意してください。これを正しく行うには、より堅牢なソリューションが必要ですが、一般的な考え方がわかります。

function runScript(e) {
    //See notes about 'which' and 'key'
    if (e.keyCode == 13) {
        var tb = document.getElementById("scriptBox");
        eval(tb.value);
        return false;
    }
}

関数の値を返すと、イベントハンドラーにイベントをバブルしないように警告し、keypressイベントがそれ以上処理されないようにします。

ノート：

現在非推奨keyCodeになっていることが指摘されています。次善の代替案も非推奨になりました。which

残念ながら、key最近のブラウザで広くサポートされている人気のある標準は、IEとEdgeでいくつかの危険な動作をします。IE11より古いものは、ポリフィルが必要です。

さらに、非推奨の警告はとについてはかなり不吉ですが、それらを削除するkeyCodeとwhich、膨大な数のレガシーWebサイトに大きな打撃を与えることになります。そのため、彼らがすぐにどこかに行くことはありそうにありません。

于 2009-05-25T03:35:11.080 に答える
141

との両方event.whichを使用しevent.keyCodeます。

function (event) {
    if (event.which == 13 || event.keyCode == 13) {
        //code to execute here
        return false;
    }
    return true;
};
于 2012-01-20T08:17:03.217 に答える
82

jQuery を使用している場合:

$('input[type=text]').on('keydown', function(e) {
    if (e.which == 13) {
        e.preventDefault();
    }
});
于 2012-06-08T17:46:42.983 に答える
18

フォームのアクションをオーバーライドonsubmitして関数の呼び出しにし、その後にreturn falseを追加します。つまり、次のようになります。

<form onsubmit="javascript:myfunc();return false;" >
于 2009-05-25T03:40:51.813 に答える
5

ENTER以下のコードは、ページ全体にキーのリスナーを追加します。

これは、ログイン、登録、送信などのアクション ボタンが 1 つの画面で非常に便利です。 

<head>
        <!--Import jQuery IMPORTANT -->
        <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>

         <!--Listen to Enter key event-->
        <script type="text/javascript">

            $(document).keypress(function (e) {
                if (e.which == 13 || event.keyCode == 13) {
                    alert('enter key is pressed');
                }
            });
        </script>
    </head>

すべてのブラウザでテスト済み。

于 2016-12-14T07:40:15.773 に答える
3

私の観点から見ると、はるかにシンプルで効果的な方法は次のとおりです。 

function onPress_ENTER()
{
        var keyPressed = event.keyCode || event.which;

        //if ENTER is pressed
        if(keyPressed==13)
        {
            alert('enter pressed');
            keyPressed=null;
        }
        else
        {
            return false;
        }
}
于 2015-06-07T11:07:37.447 に答える
3

jQuery ソリューション。

テキスト入力のぼかしイベントが発生するまで、フォームの送信を遅らせる方法を探してここに来ました。

$(selector).keyup(function(e){
  /*
   * Delay the enter key form submit till after the hidden
   * input is updated.
   */

  // No need to do anything if it's not the enter key
  // Also only e.which is needed as this is the jQuery event object.
  if (e.which !== 13) {
       return;
  }

  // Prevent form submit
  e.preventDefault();

  // Trigger the blur event.
  this.blur();

  // Submit the form.
  $(e.target).closest('form').submit();
});

フォームの送信だけでなく、すべての遅延イベントを発生させた、より一般的なバージョンを取得するとよいでしょう。

于 2014-01-08T15:49:50.513 に答える