JSON 解析的消息不会显示在使用 Ajax 的页面上 - JSON parsed Messages do not display on page using Ajax

下面我提到了来自.JS和的问题相关脚本。PHP页面使问题尽可能短，更清晰。

如果我在表单页面上输入正确的电子邮件和密码后提交表单，它会在数据库表中插入数据。如果我在表单页面上输入了不正确的电子邮件和/或密码后提交表单，由于我编写的服务器端验证脚本，它不会在数据库表中插入数据。所以脚本部分工作正常。

当我使用警报(数据(时，我能够在页面上.js警报成功/错误消息;但是当我尝试为访问者打印这些消息时，这些消息不会显示在页面上。下面是我在警报框中收到的示例消息。

{"status":"OK","message":"Inserted successfully"}

我应该怎么做才能在页面上显示这些消息？请让我知道。

客户端页面(联系人.js(

$.ajax({
url: "./contact_p.php",
type: "POST",
data: {
    emailid: emailid,
        secretcode: secretcode
},
cache: false,
success: function() {
//alert(data);
// Success message
$responsetext=JSON.parse(data);    
if($responseText.staus=='OK')
{
    $('#success').html("<div class='alert alert-success'>");
    $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-success')
    .append("<strong> " + $responseText.message + " </strong>");
    $('#success > .alert-success')
    .append('</div>');
}
else if($responseText.status=='ERR')
{
    // Fail message
    $('#success').html("<div class='alert alert-danger'>");
    $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-danger').append("<strong> " + $responseText.message + " ");
    $('#success > .alert-danger').append('</div>');
}
},

服务器端页面 (contact_p.php(

if( empty($str_r_email) || validateEmail($str_r_email)==false )
{
    $response['status']='ERR';
    $response['message']= "Invalid Email ID!";
    echo json_encode($response); 
    return ;
}
if( empty($str_r_secretcode) || $_SESSION['image_secret_code'] !=    $str_r_secretcode )
{
    $response['status']='ERR';
    $response['message']= "Invalid Secrete Code!";
    echo json_encode($response);
    return ;
}
$str_insert = "INSERT INTO t_contact (emailid,idate,ipaddress) VALUES('".$str_emailid."','".date("Y-m-d H:i:s")."','".$_SERVER['REMOTE_ADDR']."')";
RunQuery($str_insert);
$response['status']='OK';
$response['message']='Inserted successfully';
echo json_encode($response);
return ;

你不需要解析 json。只需为您的成功函数尝试此代码即可。

success: function(res) {
if(res.staus=='OK')
{
    $('#success').html("<div class='alert alert-success'>");
    $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-success')
    .append("<strong> " + res.message + " </strong>");
    $('#success > .alert-success')
    .append('</div>');
}
else if(res.status=='ERR')
{
    // Fail message
    $('#success').html("<div class='alert alert-danger'>");
    $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-danger').append("<strong> " + res.message + " ");
    $('#success > .alert-danger').append('</div>');
}
}

伙计，变量$responsetext=JSON.parse(data);在PHP中，它应该被var responsetext=JSON.parse(data);

如果你的PHP返回一个Content-Type: application/json头，那么AJAX会自动在你的成功函数中给出一个JSON对象(你忘了用success写data参数，不知道是不是错别字(。

如果您没有Content-Type: application/json标头，则在 ajax 调用中添加dataType: "JSON"，如下所示：

$.ajax({
url: "./contact_p.php",
type: "POST",
dataType: "JSON",
data: {
    emailid: emailid,
        secretcode: secretcode
},
cache: false,
success: function(data) {
//alert(data);
// Success message
var $responsetext=data;    
if($responseText.staus=='OK')
{
    $('#success').html("<div class='alert alert-success'>");
    $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-success')
    .append("<strong> " + $responseText.message + " </strong>");
    $('#success > .alert-success')
    .append('</div>');
}
else if($responseText.status=='ERR')
{
    // Fail message
    $('#success').html("<div class='alert alert-danger'>");
    $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
    .append("</button>");
    $('#success > .alert-danger').append("<strong> " + $responseText.message + " ");
    $('#success > .alert-danger').append('</div>');
}