无法在本地服务器上运行xmlHttp.responseXML

时间:2014-05-23 11:21:08

标签: javascript php jquery html ajax

我现在正在学习AJAX和XML。最近我遇到了一个愚蠢的问题。

我尝试构建一个简单的程序,它将在<div>中显示我输入到输入框中的所有内容。 出于某种原因,当我尝试使用.responseXML属性时,我的程序不会运行。请注意,当我使用.responseText时,一切正常。

我的HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
        <script type="text/javascript" src="foodstore.js"></script>
    </head>
    <h3> the chuff bucket </h3>
    <body onload="process()">

        <input type="text" id="userInput"/>
        <div id="underInput"></div>
    </body>
</html>

我的PHP代码:

<?php
header('Content-Type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';
echo '<response>';
$food=$_GET['food'];
echo $food;
echo '</response>';
?>

我的js代码:

// JavaScript Document
var xmlHttp= createXmlHttpRequestObject();



function createXmlHttpRequestObject(){
    var xmlHttp;


    if(window.ActiveXObject){
        try{
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }catch(e){
            xmlHttp = false;
    }


    } else {
        try{
            xmlHttp = new XMLHttpRequest();
        }catch(e){
            xmlHttp = false;
        }
    }

    if(!xmlHttp){
        alert("cant create object");
    }else{
        return xmlHttp;
    }
}



function process(){
    var x = xmlHttp.readyState
    if(xmlHttp.readyState==0||xmlHttp.readyState==4){

        food = encodeURIComponent(document.getElementById("userInput").value)
        xmlHttp.open("GET","foodstore.php?food=" + food , true);
        x=xmlHttp.readyState;
        xmlHttp.onreadystatechange= handleServerResponse;
        xmlHttp.send(null);

    }else{
        setTimeout('process()',1000);
    }   
 }


function handleServerResponse(){

    if(xmlHttp.readyState==4){
        if(xmlHttp.status==200){

        var xmlResponse= xmlHttp.responseXML;
            root = xmlResponse.documentElement;
            alert(root.firstchild);
            //message= root.firstChild.data;

            document.getElementById("underInput").innerHTML= '<span        style="color:blue">' + xmlResponse + '</span>';
            setTimeout('process()', 1000);
        }else{
            alert('not working');
        }
    }
}

感谢帮助者。

2 个答案:

答案 0 :(得分:0)

您是否尝试过使用jQuery?这可能更容易。您可以指定数据类型

function ajaxJQueryRequest(url,afterReqFunction){
    var request = $.ajax({
        url: url,
        type: "GET",
        crossDomain: true,
        dataType: "xml"
        });
    request.done(function(msg) {
            afterReqFunction(msg);
        });
    request.fail(function(jqXHR, textStatus) {
        alert( "Request failed: " + textStatus );
        });
}

答案 1 :(得分:0)

好的,我想我发现了这个错误。 我输入了php文件的url(将响应发送到html)并收到以下错误: &#34;此页面包含以下错误:

第6行第2行的

错误:仅在文档开头提供XML声明&#34;

在我删除了我的php顶部的空白后,我收到了一个新的错误,在我修复了新错误后,一切都像魅力一样......非常感谢!!