JavaScript でフォームを送信クリック
このチュートリアルでは、JavaScript の submit() 関数を使用してフォームを送信する方法について説明します。
リンクをクリックし、JavaScript の submit() 関数を使用してフォームを送信する
JavaScript では、form タグを使用してフォームを作成し、id 属性を使用してフォームに ID を指定できます。その後、フォームを送信する方法を選択する必要があります。たとえば、フォームを送信できます。リンクまたはボタンがクリックされたとき。現在、フォームを送信する方法は 2つあり、onclick 属性を使用して HTML コード内で実行するか、JavaScript 内で実行できます。たとえば、onclick 属性を使用して HTML 内のフォームを送信してみましょう。以下のコードを参照してください。
<form id="FormId">
<a href="FormLink" id = "LinkID" onclick="document.getElementById('FormId').submit();"> SubmitForm </a>
</form>
要件に応じて、上記のコードの form ID とリンク ID を変更できます。HTML と JavaScript コードを混在させているため、この方法はお勧めしません。フォームとリンクの両方の ID を使用して、JavaScript で個別に行うこともできます。たとえば、別の JavaScript を使用して上記の操作を実行してみましょう。以下のコードを参照してください。
var myform = document.getElementById('FormId');
document.getElementById('LinkId').addEventListener('click', function() {
myform.submit();
});
HTML と JavaScript は別々のファイルにあるため、この方法をお勧めします。これらの要素を JavaScript で取得するには、HTML で定義したフォーム ID とリンク ID を使用する必要があることに注意してください。リンクをクリックするとフォームが送信されます。
ボタンをクリックし、JavaScript の submit() 関数を使用してフォームを送信する
ボタンを使用してフォームを送信できます。フォームを送信するには 2つの方法があり、onclick 属性を使用して HTML コード内で実行するか、JavaScript 内で実行できます。たとえば、onclick 属性を使用して HTML 内のフォームを送信してみましょう。以下のコードを参照してください。
<form id="FormId">
<button id = "ButtonId" onclick="document.getElementById('FormId').submit();"> SubmitForm </button>
</form>
上記の方法と同様に、HTML と JavaScript コードを混在させているため、この方法はお勧めしません。別の JavaScript を使用して上記の操作を実行してみましょう。
var myform = document.getElementById('FormId');
document.getElementById('ButtonId').addEventListener('click', function() {
myform.submit();
});
