jQuery、PHP 和 AJAX 问题

Question

所以我已经阅读了 jQuery AJAX 页面和一堆教程，但是在这里遇到了一个小问题。

没有错误或警告，只是一个空白页。

当用户使用他们的电子邮件地址填写时事通讯订阅测试字段时，我正在尝试发送电子邮件，并且当您单击提交时，页面会刷新！ （第一个问题）并且它无法在页面上显示任何内容（第二个问题），您所看到的只是一个空白页面。未收到任何电子邮件。

我已经单独测试了电子邮件脚本，效果很好。我已经在不同的网站上使用了几个月，所以我知道它可以工作。

我尝试在 jQuery 等中进行更改，但没有任何帮助解决此问题。

jQuery:

$(function () {
    var txt = $('.email').val();

    $.ajax({
        url: 'index.php',
        type: 'post',
        data: {
            email: txt
        },
        success: function (data) {
            alert(data);
        },
        error: function (err, req) {
            $('#Response').html({
                "Somethin' got broked. Please try again."
            });
        }
    });
});

PHP：

<?php


    if($_POST["email"] != null)
    {
        require_once "Mail.php";

        $email = $_POST["email"];

        // Send it.
        $from = "X@X.com.au";
        $to = $email;
        $subject = "Newsletter Subscription Request.";
        $body = "Thank you for subscribing to our newsletter!";
        $host = "mail.X.com.au";
        $username = "no-reply@X.com.au";
        $password = "X";
        $headers = array ('From' => $from,
                    'To' => $to,
                    'Subject' => $subject);
        $smtp = Mail::factory('smtp',
                    array ('host' => $host,
                    'auth' => true,
                    'username' => $username,
                    'password' => $password));
        $mail = $smtp->send($to, $headers, $body);
    }
?>

HTML：

  <h4 id="Response">Stay informed. Subscribe to our Newsletter!</h4>
      <form class="newsletterForm" action="index.php" method="post">
        <input type="text" class="email" name="email" />
        <input type='submit' class="btn" value="Subscribe" />
      </form>

有人可以帮我弄清楚为什么这不起作用吗？

谢谢

Answer 1

请试试这个，你一定能解决问题。
function FormSubmit() { $.ajax({ type: "POST", url: 'index.php', data: $("#form_main").serialize(), async: false }).done(function( data ) { $("#Response").hide(); if (isNaN(data)) {
dispmsg = "<div class='alert alert-danger' role='alert'>Oops..Something had gone wrong! Please try again!</div>"; $("#assess_me_response").html(dispmsg); setTimeout('ResetForm();',3000); } else { dispmsg = "<div class='alert alert-success' role='alert'>Thank you for sharing the details. Our Consultant will contact you shortly!</div>"; $("#assess_me_response").html(dispmsg); setTimeout('Redirect();',3000); } return true; }); }

让你的 php 像这样..

<?php
$to = "xxxx@some.com";  

$name = $_POST['name'];
$email = $_POST['email'];
$age = $_POST['age'];
$phone = $_POST['phone'];   
$subject = "Entry received";                                        

$msg = "\n Name:" . $name . "\n Email id:" . $email ."\n Age:". $age . "\n Contact number: " . $phone;      
$headers = "From:xxx@yyy.com";
mail($to,$subject,$msg,$headers);
echo "<div align='center'>Thank you " . $name . "!, we will contact you shortly.</div>";  
?>

试试这个你可以解决。

Answer 2

当这样的东西不起作用时，我要做的第一件事就是在 Chrome 开发者工具窗口中查看页面调用。

就您的代码而言，页面刷新的原因是表单提交正在执行。为了防止这种情况发生，您必须捕获表单提交：

$("form").submit(function() {
        // Do ajax
        return false; // Keeps the form from submitting
    });

一旦你做到了，你应该会得到更好的结果。

不过，我要提醒的是，让 PHP 电子邮件发送表单不使用首先使用 ajax 更容易，只需让它处理常规表单提交即可。一旦成功，然后在它上面绑定 ajax。

Answer 3

通过以下行，您假设从 PHP 脚本收到答案

success: function(data) { 
            alert(data);  
}

但在 PHP 脚本中，您不会输出任何内容...尝试编写类似的内容

 //[...]
 $smtp = Mail::factory('smtp',
                    array ('host' => $host,
                    'auth' => true,
                    'username' => $username,
                    'password' => $password));
        $mail = $smtp->send($to, $headers, $body);
        die(1);