Q&A
回答いただきありがとうございます。
jsとjqueryでsubmit関数が同じものかと思っていましたが違うんですね。
納得しました。
実現したいこと
・<form action="*" method="post" id="form" onsubmit="return false;">の場合に、jqueryのセレクタだと、送信できない理由が知りたいです。
全コード
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> $(function(){ $('#open').on('click',function(){ $('.modal').show(); }); $('.modal').on('click', function(){ $('.modal').hide(); }); }); function send(formname){ if (typeof jQuery == 'undefined') { console.log('jQuery is not loaded'); } else { console.log('jQuery is loaded'); } // js // document.getElementById(formname).submit(); //-------動く // jquery // $('#form').submit(); // ----- 動かない $('#form').submit(function(){ // --------動かない return true; }) } </script> </head> <body> <form action="javascript:alert('送信成功!');" method="post" id="form" onsubmit="return false;"> <!-- <form action="*" method="post" id="form" > --> <input type="text" name="input1" value="1"> <input type="text" name="input2" value="2"> <input type="button" value="open" id="open"> </form> <div class="modal" style="display: none;"> <input type="button" onclick="send('form')" value="send"> </div> </body> </html>
発生している問題・エラーメッセージ
上記に書いたform内にEnterでの送信を防ぐため、onsubmit="return false;"をいれて
jsかjQueryのイベントで送信しようとしています。
しかし、jsのコードでは送信できましたが、jqueryでは動きませんでした。
return falseを外せば、jqueryでも動作しました。
試したこと
各場所を変えてみましたが、jqueryのほうは動作しませんでした。
jqueryは読み込まれているようです。
jqueryとjsのsend()は動作が違うのでしょうか？
そもそも書き方が間違っていますか？
この違いについて教えていただけると嬉しいです。よろしくお願いします。
回答2件
0
jQueryのsubmitメソッドがformのsubmitをエミュレートしているわけではないからと考えればよいのでは？
どうしても発行したいならこう
javascript
1$('#form').get(0).submit();
投稿2023/04/11 01:39
総合スコア114747
0
ベストアンサー
HTMLFormElement.submit() は、submit イベントを発生させずにフォーム送信を行います。
https://developer.mozilla.org/ja/docs/Web/API/HTMLFormElement/submit
submit イベントは発生しません。特に、フォームの onsubmit イベントハンドラーは実行されません。
jQuery の submit() は、submit イベントを発生させ、イベントがキャンセルされなければ HTMLFormElement.submit() を呼びます。
jQuery はいろいろと余計なことをやりがちなので、できるだけ使わない方が時間の節約になります。
投稿2023/04/11 01:26
総合スコア20790
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2023/04/12 00:18