見出し画像

【JavaScript】submitの使い方

関野泰宏

送信処理をコントロールする

submit イベントをJavaScriptから操作する。

通常は、HTMLタグのinput 内にtype属性としてsubmit を設定しますが

JavaScriptだけで実現できるのがsubmit() メソッドになります。

サンプルプログラム

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
    <form name="myform">

        <!-- ボタン要素で送信ボタンを設置 -->
        <button id="btn">送信</button>
    </form>
    <script>
        var btn = document.getElementById("btn");
        
        btn.addEventListener("click", function() {
            console.log("ボタンが押されました");
            
            //submit()でフォームの内容を送信
            document.myform.submit();
        });
    </script>
</body>
</html>

実行結果


ボタンが押されました

この例では、form内にbuttonタグ で定義した送信ボタンを設置

JavaScriptコード内で myform.submit() と記述することで送信処理を行います。

サンプルダウンロード


もっと学びたい人は！この本がおすすめです！

#JavaScript #JavaScript初心者 #JavaScript学習 #プログラミング #プログラミング学習 #プログラミング初心者

この記事が気に入ったらサポートをしてみませんか？