Question

我有一个简单的ajax脚本，它将3个变量发送到外部php脚本，然后将它们添加到数组中并将数组发回，我希望它在javascript控制台中输出它，这样我就可以检查变量正在成功传回，但是当我运行脚本时，控制台中没有任何内容，只有

XHR finished loading: "http://localhost/blank/scripts/ajax/profile_password_submit.php".

这是ajax

$("#pro_content_password").submit(function() {

    var url = "scripts/ajax/profile_password_submit.php"; // the script where you handle the form input.
    var js_array=new Array();
    $.ajax({
           type: "POST",
           url: url,
           data: $("#pro_content_password").serialize(), // serializes the form's elements.
           success: function(data){

                js_array=data;

                console.log(js_array);

             },
             dataType: 'json'
         });

    return false; // avoid to execute the actual submit of the form.
});

这是外部php脚本

    session_start();
  include '../../connect.php';

  $user_id = "";
  $user_id = $_SESSION['userId'];
  echo $user_id;
 if(empty($_SESSION['userId'])){

     echo "user id session not set";
     exit;
  }


$old_password = $_POST['pro_content_password_old'];
$new_password = $_POST['pro_content_password_new'];
$new_password1 = $_POST['pro_content_password_verify'];


$password_array = array("old"=>$old_password,"new"=>$new_password, "new1"=>$new_password1);


echo json_encode($password_array);

有什么想法吗？我也使用谷歌Chrome控制台

Answer 1

看起来你没有输出正确的JSON对象。我不知道一个事实，因为你还没有分享你的PHP脚本输出的内容，但我觉得这一行是导致你的问题：

echo $user_id;

您不只是输出JSON编码的PHP数组，而且还输出$user_id变量。

jQuery的ajax成功回调只有在收到格式正确的JSON对象时才会触发，而你的对象不是。它可能看起来更像是这样：

1234{"old": "oldpass", "new": "newpass", "new1": "newpass1"}

Answer 2

您需要JSON.stringify：

$("#pro_content_password").submit(function() {

    var url = "scripts/ajax/profile_password_submit.php"; // the script where you handle the form input.
    var js_array=new Array();
    $.ajax({
           type: "POST",
           url: url,
           data: $("#pro_content_password").serialize(), // serializes the form's elements.
           success: function(data){

                js_array=JSON.stringify(data);

                console.log(js_array);

             },
             dataType: 'json'
         });

    return false; // avoid to execute the actual submit of the form.
});

Answer 3

这是现在的最终工作版本，它与我的原版有很多不同，但效果更好

    <script type="text/javascript">
function submit_profile_password(){
    //var results = document.getElementById("results");
    var result_error = document.getElementById("pro_content_error_password");
    var old_error = document.getElementById("pro_password_old_comment");
    var new_error = document.getElementById("pro_password_new_comment");
    var new1_error = document.getElementById("pro_password_new1_comment");

    var oldPass = document.getElementsByName("pro_content_password_old")[0].value;
    var newPass = document.getElementsByName("pro_content_password_new")[0].value;
    var new1Pass = document.getElementsByName("pro_content_password_verify")[0].value;
    var vars = "oldPass="+oldPass+"&newPass="+newPass+"&new1Pass="+new1Pass;

    var hr = new XMLHttpRequest();
    hr.open("POST", "scripts/ajax/profile_password_submit.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var data = JSON.parse(hr.responseText);
            //results.innerHTML = "";

            for(var obj in data){
                if(obj == "old"){
                    old_error.innerHTML = "";
                    old_error.innerHTML = data[obj];

                }else if(obj == "new"){
                    new_error.innerHTML = "";
                    new_error.innerHTML = data[obj];

                }else if(obj == "new1"){
                    new1_error.innerHTML = "";
                    new1_error.innerHTML = data[obj];

                }else if(obj == "result"){
                    result_error.innerHTML = "";
                    result_error.innerHTML = data[obj];

                }

                //alert("Key = "+obj+"value = "+data[obj]+"");

            }
        }
    }
    hr.send(vars);
    //results.innerHTML = "requesting...";
    return false; 
}





</script>

感谢大家的帮助

在javascript控制台中从php输出数组

3 个答案: