Question

我创建了一个使用AJAX处理表单的注册系统，以便我可以返回false。相关的js是最顶层的代码。我将此数据传递给join.php，后者将其发送到数据库。我在join.php中运行一个检查，以确保没有重复电子邮件的人已经注册。如您所见，如果电子邮件已存在，我想使用javascript插入一条消息。它不是读取脚本标签，而是简单地将它们以明文形式粘贴到我的警报中......所以我的警报具有数据字符串，然后实际上是代码<script>...</script>。我怎样才能让这个js处理呢？

使用Javascript：

$(".submit").click(function() {  
        var dataString = {
            school : $("#school").val(),
            studentEmail : $("#studentEmail").val(),
            studentPassword : $("#studentPassword").val(),
            parentEmail : $("#parentEmail").val(),
            parentPassword : $("#parentPassword").val(),
            studentFirstName : $("#studentFirstName").val(),
            studentLastName : $("#studentLastName").val(),
            studentPhone : $("#studentPhone").val(),
            parentFirstName : $("#parentFirstName").val(),
            parentLastName : $("#parentLastName").val(),
            parentPhone : $("#parentPhone").val()
        };
        $.ajax({
            type: "POST",
            url: "join.php",
            data: dataString,
            success: function(data) {
                alert ("data sent: "+ data);
            }
        });
        return false;
    }
});

join.php

if($_POST) {
    $school             = mysql_real_escape_string($_POST['school']);
    $studentEmail       = mysql_real_escape_string($_POST['studentEmail']);
    $parentEmail        = mysql_real_escape_string($_POST['parentEmail']);
    $studentFirstName   = mysql_real_escape_string($_POST['studentFirstName']);
    $studentLastName    = mysql_real_escape_string($_POST['studentLastName']);
    $studentPhone       = mysql_real_escape_string($_POST['studentPhone']);
    $parentFirstName    = mysql_real_escape_string($_POST['parentFirstName']);
    $parentLastName     = mysql_real_escape_string($_POST['parentLastName']);
    $parentPhone        = mysql_real_escape_string($_POST['parentPhone']);

    $check = mysql_query("SELECT studentEmail FROM clients WHERE  studentEmail = '{$studentEmail}';");
    $num = mysql_num_rows($check);


    if (($num) == 0) {

        $sql = "INSERT INTO clients ".
            "(`studentEmail`, `studentPassword`, `parentEmail`, `parentPassword`, ".
            "`studentFirstName`, `studentLastName`, `studentPhone`, `parentFirstName`, ".
            "`parentLastName`, `parentPhone`, `school`) ".
            " VALUES ('$studentEmail', '$studentPassword', '$parentEmail', ".
            "'$parentPassword', '$studentFirstName', '$studentLastName', ".
            "'$studentPhone', '$parentFirstName', '$parentLastName', '$parentPhone', '$school')";

        $result = mysql_query($sql);
        if ($result) { 
            echo "Database query successful!";
        }
        else {
            die("Database query failed: " . mysql_error()); 
        }

        include "emails/signUp.php";
    }
    else {
        echo 'FAIL

        <script>
            $(".formErrorMessage").html("Email already exists");
        </script>';
    }
}

Answer 1

警报显示您的脚本阻止，因为您已在成功处理程序中获得此功能：

alert ("data sent: "+ data);

数据将是您在PHP中输出的任何文本。如果你想根据你的请求是否成功而拥有变量行为，我建议你的PHP返回包含成功标志和消息的JSON。您的JavaScript回调将如下所示：

function(data) {
    if (data.success) {
        alert ("data sent: "+ data.message);
    } else {
        $(".formErrorMessage").text(data.message);
    }
}

然后，您的PHP应该将您的内容类型更改为JSON：

header('Content-Type: application/json');

...你的回声会变成这样的东西：

echo '{"success": false, "message": "Email already exists."}';

Answer 2

您的服务器调用不应该返回原始HTML。应该返回包含服务器处理事物所需的所有状态信息的JSON。即通常情况下：

{'success': true}

或

{'success': false, 'emailAlreadyExists': true, 'msg': 'Email Already Exists'}

的

{'success': false, 'msg': 'Database query failed: blahblahMySqlError'}

然后你的客户端JS应该处理它......

$.ajax({
    type: "POST",
    url: "join.php",
    data: dataString,
    success: function(data) {
        if(data.success) {
            alert ("success!");
        }
        else{
            alert("error: " + data.msg);
            if(data.emailAlreadyExists){
                $(".formErrorMessage").html("Email already exists");
            }
        }
    }
});

Answer 3

来自php，你已经给出了格式化状态响应

成功：

echo '{"status":"success", message:"Database query successful!"}';

如果帐户已存在：

echo '{"status":"failed", message:"Email already exists"}';

因此，您将能够在JavaScript回调函数

中识别出这一点

$.ajax({
        type: "POST",
        url: "join.php",
        data: dataString,
        success: function(data) {
            if(status.error == "failed"){
                $(".formErrorMessage").html(data.message);
            }
        }
    });

这是最好的方法。或者，如果您只想执行从php收到的字符串，则可以使用 eval

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

在这种情况下，不需要脚本标记作为响应，只需要执行Javascript语句。

回应Javascript出现在警报而不是处理

3 个答案: