1. ホーム
  2. javascript

[解決済み] 送信時にフォームがリダイレクトまたはリフレッシュされないようにするには?

2023-01-07 03:58:47

質問

たくさんのページを探しましたが、私の問題が見つからなかったので、投稿させていただきました。

私は送信ボタンがあるフォームを持っていて、送信されたときに私はそれがリフレッシュまたはリダイレクトされないようにしたいです。私はjQueryに機能を実行させたいだけです。

これがそのフォームです。

<form id="contactForm">
    <fieldset>
        <label for="Name">Name</label>
        <input id="contactName" type="text" />
    </fieldset>

    <fieldset>
        <label for="Email">Email</label>
        <input id="contactEmail" type="text" />
    </fieldset>

    <fieldset class="noHeight">
        <textarea id="contactMessage" cols="20"></textarea>
        <input id="contactSend" class="submit" type="submit" onclick="sendContactForm()" />
    </fieldset>
</form>        
<small id="messageSent">Your message has been sent.</small>

そして、こちらがjQueryです。

function sendContactForm(){
    $("#messageSent").slideDown("slow");
    setTimeout('$("#messageSent").slideUp();$("#contactForm").slideUp("slow")', 2000);
}

フォームにアクション要素がある場合とない場合を試しましたが、何が間違っているのかわかりません。さらに私を悩ませたのは、それを完璧に行う例があることです。 ページ例

もし、私の問題をライブで見たいのであれば ストームストーム・ネット (私のサイト) にアクセスして、サイドバーにある "Send me and email" と "RSS Subscription" をチェックしてみてください。どちらも、これを動作させるために試しているフォームです。

どのように解決するのですか?

フォームの送信を処理するだけで サブミット イベントでフォーム送信を処理し、falseを返すだけです。

$('#contactForm').submit(function () {
 sendContactForm();
 return false;
});

サブミットボタンのonclickイベントはもう必要ありません。

<input class="submit" type="submit" value="Send" />