Question

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

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

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

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

如何在页面上显示这些消息？请告诉我。

客户端页面（contact.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 ;

Answer 1

你不需要解析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>');
}
}

Answer 2

变量$responsetext=JSON.parse(data);在PHP中应该是var responsetext=JSON.parse(data);

Answer 3

如果您的PHP返回Content-Type: application/json标头，那么AJAX会自动在您的成功函数中提供一个JSON对象（您忘记在data中编写success参数，不知道它是否是是不是错字。

如果您没有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>');
}

JSON解析使用Ajax在页面上不显示消息

3 个答案: