未捕获的类型错误：无法读取 null、AjAX 的属性“documentElement”

Question

我正在制作这样的 ajax-jquery 函数：

$('.change').live('click',function(){
     $('html, body').animate({
        scrollTop: $("h4").offset().top
      }, 2000);

     $('h4').text("Edit Your Video Here :");
     $('.drop').text("Drop Your Updated Video Here...");
     $('.btn').text("Update");

     var videoID = this.id;
     xhr1 = new XMLHttpRequest();

        //initiate request
     xhr1.open('post','beforeUpdate.php',true);//true for asynchronous
     xhr1.setRequestHeader('Content-Type',"multipart/form-data");
     xhr1.setRequestHeader('vidID',videoID);
     xhr1.onreadystatechange = handleResponse;
    xhr1.send(null);     

});

function handleResponse()
{
    if(xhr1.readyState==4)//processing done
     {
        if(xhr1.status == 200)//response okie
        {
            var xmlResponse = xhr1.responseXML;
            root= xmlResponse.documentElement;
            var id = root.getElementsByTagName("ID");
            var name = root.getElementsByTagName("Nama");

            console.log("ID From Server : "+id);
            console.log("Name From Server : "+name);
        }
     }
}

所以当我的按钮{class=change}被点击时，它会发送一个 ID 到 beforeUpdate.php，在这个 php 文件中我生成一个 XML 文件将被发送回xhr1.onreadystatechange = handleResponse;这是我的 beforeUpdate。 php文件：

<?php
require 'databaseConnection.php';
openConnection();   

$headers = apache_request_headers();
$ID = $headers['vidID'];

$hasil = mysql_query("SELECT * FROM video_management where id=$ID");
$result = mysql_fetch_array($hasil);

//$test = "ID = ".$ID."\r\n"."Name = ".$result['Nama'];

//fwrite($myfile, $test);
//fclose($myfile);

//Generating XML FILE
header('Content-Type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';
echo '<response>';
    echo '<ID>';
        echo $ID;
    echo '</ID>';
    echo '<Name>';
        echo $result['Nama'];
    echo '</Name>';
    echo '<Type>';
        echo $result['Type'];
    echo '</Type>';
    echo '<Path>';
        echo $result['videoPath'];
    echo '</Path>';
echo '</response>';
closeConnection();
?>

从数据库中获取数据没有问题，我可以获取所有数据并将它们放入关联的xml元素中。

那么问题来自root= xmlResponse.documentElement;据说Uncaught TypeError: Cannot read property 'documentElement' of null,所以我在这里做错了什么......？ 太感谢了...！ :)

注意： 我的浏览器是chrome

Answer 1

我通过将 post 方法更改为 get 方法而不是使用这些行来解决它：

if(xhr1.status == 200)//response okie
        {
            var xmlResponse = xhr1.responseXML;
            root= xmlResponse.documentElement;
            var id = root.getElementsByTagName("ID");
            var name = root.getElementsByTagName("Nama");

            console.log("ID From Server : "+id);
            console.log("Name From Server : "+name);
        }

我改成

if(xhr1.status == 200)//response okie
        {
            var xmlResponse = xhr1.responseXML;
            var textResponse = xhr1.responseText;
            console.log("textResponse : "+textResponse);

            //root= xmlResponse.documentElement;
            var id = xmlResponse.getElementsByTagName("ID");
            var name = xmlResponse.getElementsByTagName("Name");

            console.log("ID From Server : "+id[0].childNodes[0].nodeValue);
            console.log("Name From Server : "+name[0].childNodes[0].nodeValue);
        }

参考： http://www.w3schools.com/ajax/ajax_xmlhttprequest_response.asp

谢谢大家.. :)