0

我不知道我做错了什么,但一切看起来都很好。我正在处理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>

当我执行此代码时,我没有得到任何结果。

4

3 回答 3

0

正如一些评论所暗示的 - 您需要查看浏览器的错误控制台。不是 NETBeans。另外,了解如何在 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/

于 2013-07-31T19:34:19.593 回答
0

我发现您的代码实际上是为 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>
于 2013-07-31T19:59:56.557 回答
0

在您的 .open() 和 .send() 调用之间,像这样设置您的请求标头:

xmlhttp.open("POST", "demo_post.php", true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send();

至少,如果你不想使用 jQuery,你会这样做。

于 2013-07-31T20:01:00.243 回答