Ajax POST请求不起作用
[英]Ajax POST request does not work
问题描述
我不知道自己在做什么错，但是看起来都不错。 我在localhost工作，尝试加载文件时遇到麻烦。
这是我的代码。 我在NetBeans中工作，控制台很清晰，没有任何错误。
<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc() {
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");
}
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("POST", "demo_post.php", true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>AJAX</h2>
<button type="button" onclick="loadXMLDoc()">Request data</button>
<div id="myDiv"></div>
</body>
</html>
当我执行此代码时，没有任何结果。
3 个解决方案
解决方案1
0 2013-07-31 19:34:19
正如一些评论所建议-您需要在浏览器的错误控制台中查看。 不是网民。 另外，了解如何在JS等中设置断点。
以下是您尝试使用jQuery实现的示例，这比使用纯Javascript简单得多。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript">
// jQuery allows you to use selectors rather than onClick, etc
// So when anything with a class called "loadData" is clicked this function will run
$(".loadData").click(function (event) {
$.ajax({
url: 'demo_post.php', // The URL that your making the request to
type: 'POST', // Type - GET or POST
dataType: 'html', // DataType - can be html, json or jsonp
cache: false, // true or false - whether you want data to be cached
data: 'foo=bar', // Any data that your submitting with the request.
error: function (error_response) {
// An error has occured so empty your #myDiv and put the error in there.
$("#myDiv").empty().append(error_response.status);
},
success: function (response) {
// Everything has worked - empty #myDiv and put the replace with response
$("#myDiv").empty().append(response);
}
});
});
</script>
</head>
<body>
<h2>AJAX</h2>
<button type="button" class="loadData">Request data</button>
<div id="myDiv"></div>
</body>
</html>
您可以在这里找到有关jQuery的更多信息： http : //api.jquery.com ，更具体地说是在此处了解jQuery的AJAX函数-http: //api.jquery.com/jQuery.ajax/
解决方案2
0 2013-07-31 19:59:56
我发现您的代码实际上是为GET方法设计的。在这种情况下，使用POST而不是get并不重要。（因为没有传递任何参数，而且它也不是形式..）并且也同意@Jackson
<!DOCTYPE html>
<html>
<head>
<!--you can use online js file but in here i download the js file from code.jquery.com/jquery-2.0.3.min.js and kept it in localhost same folder -->
<script type="text/javascript" src="/jquery-2.0.3.min.js"></script>
<script type="text/javascript">
function loadXMLDoc()
{
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");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","demo_post.php",true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>AJAX</h2>
<button type="button" onclick="loadXMLDoc()">Request data</button>
<div id="myDiv"></div>
</body>
</html>
解决方案3
0 已采纳 2013-07-31 20:01:00
在.open（）和.send（）调用之间，如下设置请求标头：
xmlhttp.open("POST", "demo_post.php", true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send();
至少，如果您不想使用jQuery，那将是您要这样做的方式。
AJAX请求不起作用（POST）
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.