Enterを押すとWebページ内のフォームが自動的に送信される問題の解決策_基礎知識

1. フォーム内に が 1 つだけある場合は、Enter キーを押すとフォームが自動的に送信されます。

コードをコピーします コードは次のとおりです:

もう 1 つ追加します

コードをコピーします コードは次のとおりです:

Enter キーを押しても自動的には送信されませんが、ページ上に理解できない入力ボックスが表示されるのは厄介です。そこで、インターネットから 2 つの解決策を見つけました。

(1) を追加します

コードをコピーします コードは次のとおりです:

入力ボックスは表示されず、Enter キーを押しても送信されません:

コードをコピーします

コードは次のとおりです:

(2) onkeydown イベントを追加します。Enter キーを押してもイベントは表示されません:

コードをコピーします

コードは次のとおりです:

キャリッジリターンイベントを追加したい場合は、onkeydown イベントに判定提出フォームを追加できます。

コードをコピーします

コードは次のとおりです:

テキスト ボックス (入力要素) で Enter キーを押してフォーム (フォーム) を送信したい場合がありますが、それを望まない場合もあります。たとえば、検索動作の場合、キーワードを入力した後に Enter キーを直接押してフォームをすぐに送信する必要がある場合、一部の複雑なフォームでは、フォームへの入力を完了する前に誤って Enter キーを押してフォームの送信をトリガーすることを避けたい場合があります。 。 これらの動作を制御するために、JS に頼る必要はありません。次に、いくつかのルールを示します。

フォーム内に type="submit" のボタンがある場合、Enter キーが有効になります。

フォームに type="text" の入力が 1 つだけある場合は、ボタンの種類に関係なく、Enter キーが有効になります。

ボタンが input ではなく button で、タイプが追加されない場合、デフォルトは IE では type=button、FX では type=submit です。

textarea や select などの他のフォーム要素は影響を受けず、ラジオ チェックボックスはトリガー ルールに影響しませんが、FX では Enter キーに反応しますが、IE では反応しません。

type="image" の入力は type="submit" と同じ効果を持ちます。なぜそのようなタイプが設計されているのかわかりません。背景を追加するには CSS を使用する方が適切です。画像。