1. ホーム
  2. javascript

[解決済み] ページを再読み込みせずにフォームを送信する

2022-12-23 15:48:56

質問

クラシファイドサイトを持っていて、広告を表示するページに、"Send a tip to a friend"のフォームを作っているのですが...。

そのため、希望する人は誰でも、広告の情報を友人の電子メールアドレスに送信することができます。

フォームがPHPのページに送信されなければならないのでは?

<form name="tip" method="post" action="tip.php">
  Tip somebody: 
  <input 
    name="tip_email"
    type="text" 
    size="30" 
    onfocus="tip_div(1);" 
    onblur="tip_div(2);"
  />
  <input type="submit" value="Skicka Tips" />
  <input type="hidden" name="ad_id" />
</form>

フォームを送信すると、ページが再読み込みされる...。そんなの嫌だ...。

リロードされずにメールを送信する方法はありますか? できればajaxやjqueryを使わないで...。

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

ページを再読み込みせずにメールを送信するには、ajaxリクエストを送信する必要があります。を見てみましょう。 http://api.jquery.com/jQuery.ajax/

あなたのコードは、次のようなものであるべきです。

$('#submit').click(function() {
    $.ajax({
        url: 'send_email.php',
        type: 'POST',
        data: {
            email: '[email protected]',
            message: 'hello world!'
        },
        success: function(msg) {
            alert('Email Sent');
        }               
    });
});

フォームはバックグラウンドで送信され send_email.php ページがリクエストを処理し、メールを送信する必要があります。