Question

我对整个“后端”开发相当新。我设置了一个localhost写了我的html请求，没有可见的语法错误，但我的新内容仍然不会更新页面。

<!DOCTYPE html>
<html>
<head>
    <title>Loading Html With AJAX</title>
</head>
<body>
<header><h1>Maker Bus</h1></header>
<section id="content"></section>
<script type="text/javascript" src="/Applications/MAMP/htdocs/loadingHtml.js"></script>
</body>
</html>




var xhr= new XMLHttpRequest();

xhr.onload=function(){
    //Server Check
    if(xhr.status==200){
        document.getElementById('content').innerHTML=xhr.responseText;

    }
};

xhr.open('GET' ,'http://localhost:8888/data.html',true);
xhr.send(null);

Answer 1

此ajax请求中缺少很多内容...包括您正在使用浏览器可能支持的onload函数。请查看此link

1.你不是像IE那样制作一个独立于浏览器的XMLHttpRequest，我们需要一个ActiveXObject ...

var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

2.您应该使用onreadystatechange函数（在响应准备就绪时调用），因为当时响应不准备，所以您使用的函数不会工作。

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }

3.要求来自

的回复的网址

xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();

For the full example read here

Answer 2

只需在javacript文件中输入此函数，我相信它对您有用。

function getContent(){
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var content = document.getElementById("content");
content.value  = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "data.html", true);
xmlhttp.send();
}

//ON YOUR BODY TAGS IN HTML PAGE 
<body onload="getContent()"></body>

这绝对有效，相信我，整个星期都处于同样的境地;请注明你是否成功。

无法在Ajax请求上加载新的HTML内容

2 个答案: