ホームページ > 記事 > ウェブフロントエンド > Enter キーを押したときにフォームが送信されないようにするにはどうすればよいですか?
ENTER キーを押したときのフォーム送信の防止
Web ベースのアプリケーションでは、ENTER キーによるフォームの送信を防止することで、フォームがユーザーが明示的に送信ボタンをクリックしたときに送信されます。このアプローチにより、ユーザー エクスペリエンスが向上し、偶発的なフォーム送信が防止されます。
ENTER キーによってフォーム送信がトリガーされないようにするには、次のコード スニペットを使用できます。
function checkEnter(e) { e = e || event; var txtArea = /textarea/i.test((e.target || e.srcElement).tagName); return txtArea || (e.keyCode || e.which || e.charCode || 0) !== 13; }
checkEnter 関数を使用するには、キー押下ハンドラーとしてフォームに添付できます。
<form [...] onkeypress="return checkEnter(event)">
あるいは、以下の ES20xx アプローチ:
document.addEventListener(`keypress`, handle); function handle(evt) { const form = evt.target.closest(`#testForm`); if (form) { if (evt.target.dataset.enterForSubmit) { if (evt.key === `Enter`) { evt.preventDefault(); return logClear(`won't submit "${evt.target.value}"`); } return true; } } }
このアプローチでは、イベント委任を使用して、ENTER キーが押されたときにフォームの送信を防止し、ユーザーが送信をトリガーせずに textarea 要素に複数行のテキストを入力できるようにします。
以上がEnter キーを押したときにフォームが送信されないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。