225

私のページには、動作していないように見える次の JavaScript があります。

$('form').bind("keypress", function(e) {
  if (e.keyCode == 13) {               
    e.preventDefault();
    return false;
  }
});

入力時にフォームの送信を無効にしたい、またはもっと良いのは、私の ajax フォーム送信を呼び出すことです。どちらの解決策も受け入れられますが、上記のコードはフォームの送信を妨げません。

4

20 に答える 20

462

がキャッチされない場合keyCodeは、次をキャッチしwhichます。

$('#formid').on('keyup keypress', function(e) {
  var keyCode = e.keyCode || e.which;
  if (keyCode === 13) { 
    e.preventDefault();
    return false;
  }
});

編集：それを逃した、keyup代わりに使用する方が良いkeypress

編集 2: Firefox の一部の新しいバージョンではフォームの送信が妨げられないため、キープレス イベントをフォームに追加する方が安全です。また、イベントをフォーム「名前」にバインドするだけでは機能しませんが、フォームIDにのみバインドします。したがって、コード例を適切に変更することで、これをより明確にしました。

編集3：bind()に変更on()

于 2012-06-27T22:28:51.133 に答える
65

通常Enter、入力要素にフォーカスがあるときにフォームが送信されます。

フォーム内の入力要素のEnterキー (コード)を無効にできます。13

$('form input').on('keypress', function(e) {
    return e.which !== 13;
});

デモ: http://jsfiddle.net/bnx96/325/

于 2012-06-27T22:28:59.683 に答える
43

さらに短い：

$('myform').submit(function() {
  return false;
});
于 2012-12-07T20:41:16.833 に答える
24 
$('form').keyup(function(e) {
  return e.which !== 13  
});

event.whichプロパティは、event.keyCode と event.charCode を正規化します。キーボードのキー入力は event.which を監視することをお勧めします。

whichドキュメント。

于 2012-06-27T22:27:49.007 に答える
9

ENTER キーのすべてのキーストロークをキャプチャしてテストしなければならないというやり過ぎは本当に私を悩ませているので、私のソリューションは次のブラウザーの動作に依存しています。

ENTER を押すと、送信ボタンでクリックイベントがトリガーされます (IE11、Chrome 38、FF 31 でテスト済み) ** (参照: http://mattsnider.com/how-forms-submit-when-pressing-enter/ )

したがって、私の解決策は、標準の送信ボタン（つまり<input type="submit">）を削除して、ENTERが押されたときに魔法のようにクリックする送信ボタンがないため、上記の動作が失敗するようにすることです。代わりに、通常のボタンで jQuery クリック ハンドラーを使用して、jQuery の.submit()メソッドを介してフォームを送信します。

<form id="myform" method="post">
  <input name="fav_color" type="text">
  <input name="fav_color_2" type="text">
<button type="button" id="form-button-submit">DO IT!</button>
</form>

<script>
 $('#form-button-submit').click(function(){
    $('#myform').submit();
  });
</script>

デモ: http://codepen.io/anon/pen/fxeyv?editors=101

** フォームに入力フィールドが 1 つしかなく、そのフィールドが「テキスト」入力の場合、この動作は適用されません。この場合、HTML マークアップ (検索フィールドなど) に送信ボタンが存在しない場合でも、ENTER キーを押すとフォームが送信されます。これは、90 年代以降の標準的なブラウザの動作です。

于 2014-10-31T21:36:05.997 に答える
7

入力ボタンと送信ボタンでの送信を無効にしたい場合は、フォームの onsubmit イベントを使用します

<form onsubmit="return false;">

「return false」を、必要なことをすべて実行し、最後のステップとしてフォームを送信する JS 関数の呼び出しに置き換えることができます。

于 2014-03-09T15:22:19.210 に答える
5

これは純粋な Javascript で完全に実行でき、シンプルでライブラリは必要ありません。これは、同様のトピックに対する私の詳細な回答です： フォームのEnterキーを無効にする

要するに、コードは次のとおりです。

<script type="text/javascript">
window.addEventListener('keydown',function(e){if(e.keyIdentifier=='U+000A'||e.keyIdentifier=='Enter'||e.keyCode==13){if(e.target.nodeName=='INPUT'&&e.target.type=='text'){e.preventDefault();return false;}}},true);
</script>

このコードは、input type='text' のみの "Enter" キーを防ぐためのものです。(訪問者がページ全体で Enter キーを押す必要がある場合があるため) 他のアクションに対しても "Enter" を無効にしたい場合は、console.log(e); を追加できます。テスト目的で、クロムでF12を押し、「コンソール」タブに移動してページの「バックスペース」を押し、その中を見て、返される値を確認します。次に、これらのすべてのパラメーターをターゲットにして、コードをさらに強化できます上記の「e.target.nodeName」、「e.target.type」などのニーズに合わせて...

于 2016-05-15T19:11:54.643 に答える
3

I don't know if you already resolve this problem, or anyone trying to solve this right now but, here is my solution for this!

$j(':input:not(textarea)').keydown(function(event){
    var kc = event.witch || event.keyCode;
    if(kc == 13){
    event.preventDefault();
        $j(this).closest('form').attr('data-oldaction', function(){
            return $(this).attr('action');
        }).attr('action', 'javascript:;');

        alert('some_text_if_you_want');

        $j(this).closest('form').attr('action', function(){
            return $(this).attr('data-oldaction');
        });
        return false;
    }
});
于 2014-07-17T17:51:56.147 に答える
1

3 年後、この質問に完全に答えた人は 1 人もいません。

質問者は、デフォルトのフォーム送信をキャンセルして、独自の Ajax を呼び出したいと考えています。これは、シンプルなソリューションを備えたシンプルなリクエストです。各入力に入力されたすべての文字をインターセプトする必要はありません。

フォームに送信ボタンがあると仮定すると、 a<button id="save-form">またはa は次の<input id="save-form" type="submit">ようになります。

$("#save-form").on("click", function () {
    $.ajax({
        ...
    });
    return false;
});
于 2015-08-26T14:21:01.740 に答える
1

次のコードは、フォームの送信に使用される Enter キーを無効にしますが、テキストエリアで Enter キーを使用することは引き続き許可します。必要に応じてさらに編集できます。

<script type="text/javascript">
        function stopRKey(evt) {
          var evt = (evt) ? evt : ((event) ? event : null);
          var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
          if ((evt.keyCode == 13) && ((node.type=="text") || (node.type=="radio") || (node.type=="checkbox")) )  {return false;}
        }

        document.onkeypress = stopRKey;
</script>
于 2013-10-11T17:48:53.757 に答える
-2

ファイルが終了すると (読み込みが完了すると)、スクリプトは「 Entry 」キーの各イベントを検出し、背後にあるイベントを無効にします。

<script>
            $(document).ready(function () {
                $(window).keydown(function(event){
                    if(event.keyCode == 13) {
                        e.preventDefault(); // Disable the " Entry " key
                        return false;               
                    }
                });
            });
        </script>
于 2016-09-22T06:36:52.687 に答える
-10

これはどう：

$(":submit").closest("form").submit(function(){
    $(':submit').attr('disabled', 'disabled');
});

これにより、アプリの送信ボタンがあるすべてのフォームが無効になります。

于 2013-02-14T15:51:49.653 に答える