Javascript HMTL、onclickイベントは、ボタンをクリックしたときに送信されますが、キーボードで入力が押されたときは送信されませんか？

Question

私は自分の問題を解決するために本当に頑張りましたが、検索結果には余分なコード（PHP、divsなど）がたくさん表示されます。

私はHTMLとJavaScriptのみを使用しています。

私は（一つの形

<form id="form1"> 
<input name="name" type="text" size="20"> 
</form> 

そして、もう一つのボタン

<button onclick="outputname()" type="submit">Search</button> 

だからアイデアは、フォーム上の数のユーザータイプで、検索ボタンをクリックすると、アクションが実行され、この作品を持っていますすばらしいです）。

しかし、ユーザが数字を入力し、キーボードのEnterボタンを押すと、ページがリフレッシュされます。 iPadでも同じことが起こります。 （「戻る」ではなく「戻る」ボタンが表示されます）。

キーボードでEnterボタンを使用し、iOSで作業するようにします。

アイデアは、ユーザーが顧客番号を入力し、関連する詳細が表示されることです。

Answer 1

必ずトラップ正しいものであることを、あなたの入力フィールドとボタンの両方にIDを付与します。

HTML：

<form action="destination.html" method="post"> 
    <input id="foo" name="name" type="text" size="20"> 
    <button id="mybutt" onclick="outputname()" type="submit">Search</button> 
</form> 

（注）に投稿されたデータを配置したい場所をdestination.htmlであること。同じファイルに投稿したい場合は、action=""を使用するか、そのまま使用してください。

Javascriptを：

document.getElementById('foo').onkeypress = function(e){ 
    if (!e) e = window.event; 
    var keyCode = e.keyCode || e.which; 
    if (keyCode == '13'){ 
     var btn = document.getElementById('mybutt'); 
     mybutt.click(); 
     return false; 
    } 
} 

出典：フォームタグ内 action="post" ：

How to detect when the user presses Enter in an input field

Capturing the Enter key to cause a button click with javascript

Answer 2

これを挿入します。すなわち、フォームタグはこの場合、このよう <form id="form1" action="post">

Answer 3

なければならないだろう、あなたの代わりにkey/clickイベントのsubmitイベントを、管理することができます。クリックまたはoutputnameを呼び出しますEnterキーを押すのいずれかによってトリガ

<form id="form1" onsubmit="outputname()"> 

提出イベント。