SweetAlert2.js アラートが一瞬で消える

Question

jqueryプラグインである、Sweetalert2.jsを使用してデザインされたアラートを表示したいと思っています。
しかし、アラートはでるものの、アラートが0.1秒くらいで消えてしまい原因もよくわかりません。
どうがお力をお貸しいただけないでしょうか？
よろしくお願いします。

以下、jqeury

     $("#sweetalert").click(function(){
  swal()({
    title: '好きなタイトルを入力',
    text: "好きなテキストを入力",
  });
});

以下、HTMLです

<form action="" method="POST" id="sweetalert"><!--コミュニティ参加エリアの開始-->
<input type="submit" class="btn btn-success" name="enter" id="enter" value="参加する" id="sweetalert"><a target="_blank" href="groupchat.php"></a></button>
</form><!---コミュニティ参加エリアの終了-->

リンクはsweetalert2.jsのリンクとsweetalert2.cssというcssのリンクを引っ張ってきています。
動きはあるので、リンク自体に問題はないとは思います。

Answer 1

ボタンがsubmitだからです。
formのactionの指定先に送信するものなので、preventDefaultで一旦止めるか、typeをbuttonにしてください。
その後、「アラートOK押された」か何かを取得してform.submit()すると良いです。

見た感じ、.then()でそのアラート押下後のイベントが拾えそうですね。

Answer 2

input="submit"ではなく、input="button"にしたら治りました。
ありがとうございました。

Comments

[m.ts10806]

送信しなくていいんですか？

[x_x]

typeのことですかね？
<button>の開始タグがなく、あとから見ても何のことやらわかりません。
修正分を追記してもらえたらと思います。