submit(サブミット)：送信させない４つの方法です🙄。#javascript #サブミットキャンセル

2022.09.07

Logging

おはようございます、台風一過が去りましたね😌。

さて、今日はsubmit(サブミット)：送信させない４つの方法を記載します、方法は大きく分けて２つの方法があり、それを細分化して４つの方法になります。まず、一番目は“送信する際（form側）”にてキャンセルする方法です。この場合、addEventListener（アッドイベントリスナー）でキャンセル処理する場合とonsubmitを使用してキャンセルする方法があります。

サンプルコード例１と例３にあたるコードが上記のコードになります。

次に”ボタンをクリック”した際にサブミット（送信）処理をキャンセルする方法です、この方法でも送信を阻止する事ができます。

サンプルコード例２と例４にあたります、自分としてはフォームで処理した方が良いかなと思いますが、こちらでも送信をキャンセルする事ができます。

尚、ソースコードは下記になります。また、参考にしたサイトのリンクを貼っときます。MDNのリンクです。

    <form id="frm" method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit1</button>
    </form>
    <form method="post" action="./example/">
        <input type="hidden" name="example" value="data">
        <button id="btn" type="submit" class="btn btn-primary">Submit2</button>
    </form>    
    <form method="post" action="./example/" onsubmit="return func1()" >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary">Submit3</button>
    </form>
    <form method="post" action="./example/"  >
        <input type="hidden" name="example" value="data">
        <button type="submit" class="btn btn-primary" onclick="return func2()" >Submit4</button>
    </form>
//例１
document.getElementById("frm").addEventListener("submit",function(event){
    event.preventDefault();
});
//例２
document.getElementById("btn").addEventListener("click",function(event){
    event.preventDefault();
    event.stopPropagation();//インターフェイスのメソッドで、キャプチャおよびバブリング段階において現在のイベントのさらなる伝播を阻止します。 
});
//例３
function func1(){
    return false;
}
//例４
function func2(){
    return false;
}

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

投稿日時 2022年09月07 06:02日

タグ

１, 2, ３, 4, addEventListener, Form, javascript, onsubmit, submit, アッド, イベント, キャンセル, クリック, コード, こちら, サブミット, サンプル, それ, フォーム, ボタン, リスナー, 一, 上記, 事, 今日, 使用, 例, 側, 処理, 台風一過, 場合, 方, 方法, 次, 細分化, 自分, 記載, 送信, 阻止, 際,

LIFESPAN(ライフスパン): 老いなき世界

2020.10.08

Logging

https://twitter.com/zip358com/status/1312577399104569344

LIFESPAN(ライフスパン): 老いなき世界という本があります。この本をパラパラと見て思ったことは、可能そうに見えてちょっとまだ先の話かもしれないなと思っています。

これからテクノロジーや人工知能などの分野がどれぐらい進化するかによって老化を阻止することが可能になるとは思っています。いまの十代の子達が大人か老人になるころには確実に老化は病気になっていて老化で死ぬということはなくなるのかもしれませんが、自分達の世代はそのテクノロジーや医学の恩恵をうけれるかどうかの瀬戸際の世代かなと思っています。

おそらく長く生きれれば、その恩恵をうけることは出来そうな気もします。ちなみに本に書かれていることを実践している人に堀江貴文さんがいます。いま彼は47歳です、正直ところ、まだ分からない。

そしてテロメアは人によって違うし、老化のスピードも人によって違います。老化が早い人もいれば遅く進む人もいるからです。

著者名  @taoka_toshiaki

※この記事は著者が40代前半に書いたものです．

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

投稿日時 2020年10月08 02:14日

タグ

47, LIFESPAN, いま, こと, これ, ころ, スパン, スピード, テクノロジー, テロメア, ところ, どれぐらい, パラパラ, ライブ, 世代, 世界, 人, 人工, 先, 分野, 医学, 十, 可能, 堀江貴文, 大人, 子, 実践, 彼, 恩恵, 本, 正直, 気, 瀬戸, 病気, 知能, 老人, 老化, 自分, 話, 進化, 阻止,