将html文件的内容加载到div中
[英]load the content of html file into the div
问题描述
I am a beginner. 
我是初学者。 The problem I am dealing with is probably very simple to solve ;) I am working on a web page where the text content is loaded from external html files into the div. 我正在处理的问题可能很容易解决;）我正在处理一个网页，其中文本内容从外部html文件加载到div中。 This is done when a user clicks on a menu item. 当用户单击菜单项时，将完成此操作。
This is my code html : 这是我的代码html：
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/menu.css">
<script type="text/javascript" src="js/js.js"></script>
</head>
<body>
<div>
<ul>
<li><a id="teachers" href="#" name="teachers" onclick="getdata()">
Teachers
</li>
</ul>
</div>
<div id="page" name="" >
bla bla bla ...
</div>
</body>
</html>
And this is my code ajax: 这是我的代码ajax：
var _xhr;
function getdata(){
_xhr= new XMLHttpRequest();
_xhr.onreadystatechange=callback;
_xhr.open("POST", "teachers.html", true);
_xhr.send();
function callback(){
var _target = document.getElementById("page");
_target.innerHTML=_xhr.responseText;
}
}
I would like to load the html file (teachers.html) into the div (id="page") when I click on the link (Teachers) 当我点击链接（教师）时，我想将html文件（teachers.html）加载到div（id =“ page”）中
Please could someone help me. 请有人帮我。
Thanks in advance. 提前致谢。
5 个解决方案
解决方案1
0 2014-10-23 13:10:48
尝试将POST更改为GET，看看是否可行。
解决方案2
0 2014-10-23 13:14:35
for this case i recommend to user jQuery Load function. 对于这种情况，我建议用户使用jQuery Load函数。 its easy to use and fit your needs. 它易于使用并满足您的需求。 you can find more in the following link: http://api.jquery.com/load/ 您可以在以下链接中找到更多信息： http : //api.jquery.com/load/
解决方案3
0 2014-10-23 13:18:09
Its pretty hard to know if you don't tell us what happened. 很难知道您是否不告诉我们发生了什么事。 I´ve figure out (maybe) a problem 我已经发现（也许）有问题
Try Change your code to 尝试将您的代码更改为
function getdata(){
function callback(){
var _target = document.getElementById("page");
_target.innerHTML=_xhr.responseText;
}
_xhr= new XMLHttpRequest();
_xhr.onreadystatechange=callback;
_xhr.open("POST", "teachers.html", true);
_xhr.send();
}
解决方案4
0 2014-10-23 13:31:00
Have you tried bringing the var _xhr; 您是否尝试过带var _xhr； inside the function? 里面的功能？
i tried the below.. it worked 我尝试了以下..它的工作
function getdata(){
var xmlhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.open("get","techers.html",false);
xmlhttp.send();
document.getElementById("page").innerHTML=xmlhttp.responseText;
}
解决方案5
0 2014-10-23 13:37:49
How about using an ajax call? 如何使用ajax调用？
$.get( "ajax/test.html", function( data ) {
$( ".result" ).html( data );
alert( "Load was performed." );
});
Documentation: http://api.jquery.com/jquery.get/ 文档： http : //api.jquery.com/jquery.get/
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.