jQuery 'enter'-keyイベントハンドラ

Question

'form'の入力をリストに追加するイベントとして 'enter'-keyを使用する際に問題があります。 以下のコードは動作しますが、「cmd + enter」の組み合わせを押すと、リストに項目が追加され、同じページで新しいタブが開きます。

私が達成しようとしているのは、「フォーム」フィールドがフォーカスされていて、「Enter」キー（「cmd + Enter」の組み合わせではない）を押すたびに、アイテムがリストに追加され、タブが同じページで開きます。 （私はFirefoxの48.0とSafari 9.1.2で自分のコードをテストしています）

は、ここでは、コードのHTML部分です：

<form id="inputWindow"> Type-in here: <input type='text' name='input'></input></form> 

ここでは、コードのjQueryの一部です。

$(document).ready(function() { 
$('#inputWindow').keypress(function(event) { 

if (event.which == 13){ 
var answer = $("input[name=input]").val(); 
    $('.list').append('<div class="item">' + answer + '</div>'); 
    }); 
}); 

Answer 1

が欠落しています。 ページの再読み込みの問題は、HTML部分にonsubmit = "return false"を追加することで簡単に解決できます。だから、コードは次のようになりなければならない。 HTML部分：

<form id="inputWindow" onsubmit="return false"> Type-in here: <input type='text' name='input'></input></form> 

jQueryの一部（）.readyあなたの$（文書を持っていると仮定します）：

$('#inputWindow').submit(function() { 
var answer = $("input[name=input]").val(); 
    $('.list').append('<div class="item">' + answer + '</div>'); 
}); 

Answer 2

あなたは実際にそれが.keypressイベントの代わりに.submit使用する方がはるかに簡単ですいくつかの});jsfiddle

$(document).ready(function() { 
    $('#inputWindow').keypress(function(event) { 

    if (event.which == 13){ 
     var answer = $("input[name=input]").val(); 
     $('.list').append('<div class="item">' + answer + '</div>'); 
    } 
    }); 
});