调试ajax

最新推荐文章于 2021-08-06 11:28:30 发布

刘利新西安

最新推荐文章于 2021-08-06 11:28:30 发布

阅读量489

点赞数

分类专栏：网页

本文链接：https://blog.csdn.net/weiyanghuadi/article/details/9027295

版权

网页专栏收录该内容

53 篇文章 0 订阅

订阅专栏

如果不通过服务器，那么，下面这个简单程序都通不过！

<html> 
  <head> 
    <title>Ajax at work</title> 

    <script language = "javascript">
      var XMLHttpRequestObject = false; 

      if (window.XMLHttpRequest) {
        XMLHttpRequestObject = new XMLHttpRequest();
      } else if (window.ActiveXObject) {
        XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
      }

      function getData(dataSource, divID) 
      { 
	    alert("inside getData");
        if(XMLHttpRequestObject) {
			alert("XMLHttpRequestObject created");
          var obj = document.getElementById(divID); 
          XMLHttpRequestObject.open("GET", dataSource); 

          XMLHttpRequestObject.onreadystatechange = function() 
          { 
		    alert("inside onread");
			alert(XMLHttpRequestObject.readyState);
			alert(XMLHttpRequestObject.status);
            if (XMLHttpRequestObject.readyState == 4 &&  XMLHttpRequestObject.status == 200) { 
			    alert("inside 200");
                obj.innerHTML = XMLHttpRequestObject.responseText; 
            } 
          } 

          XMLHttpRequestObject.send(null); 
        }
      }
    </script>
  </head> 

  <body>

    <H1>Fetching data with Ajax</H1>

    <form>
      <input type = "button" value = "Display Message" 
        onclick = "getData('data.txt', 'targetDiv')"> 
    </form>
    <p>The fetched data will go here.</p> 
    <div id="targetDiv">
      
    </div> 

  </body> 
</html>

但这个程序中并不涉及服务器端的代码。即便这样，也要在eclipse中建立dynamic web project，然后把这些静态代码全都拷贝到WebContent下面，然后启动tomcat运行！

源代码：http://pan.baidu.com/share/link?shareid=3380029435&uk=3878681452