☰

Enterキーの押下でフォームが送信されないようにする 質問する

tag-icon • tag-icon javascript forms keypress dom-events enter
Enterキーの押下でフォームが送信されないようにする 質問する

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

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

ベストアンサー1

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

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

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

Enter キーが押されたときにこのテキスト ボックスから「ユーザー定義」スクリプトを実行し、フォームを送信しないようにするには、次のサンプルコードを使用します。この関数はエラー チェックを行わないため、IE でのみ機能する可能性が高いことに注意してください。これを正しく実行するには、より堅牢なソリューションが必要ですが、概要は理解できます。

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

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

注記：

指摘されているのkeyCodeは現在は廃止されています次善の策whichは廃止された。

残念ながら、現代のブラウザで広くサポートされている推奨標準keyには、IE と Edge の危険な動作IE11より古いバージョンでは、ポリフィル。

さらに、 と に関する非推奨の警告は非常に不吉ですkeyCodeがwhich、これらを削除すると、数え切れないほど多くの従来の Web サイトに大きな変更が加えられることになります。そのため、これらがすぐになくなる可能性は低いでしょう。

おすすめ記事