Ajax Zero to Hero (2)入门代码的简单封装

最新推荐文章于 2024-09-15 19:20:58 发布

个人知识管理布道师

最新推荐文章于 2024-09-15 19:20:58 发布

阅读量508

点赞数

文章标签： ajax

本文链接：https://blog.csdn.net/u010689306/article/details/51981224

版权

Ajax 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<pre name="code" class="html"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
   
    <script type="text/javascript"> 
     /*
           url:请求服务器的地址
           method:请求方法("GET","POST")
           params:请求参数(格式类似 "fname=Bill&lname=GATE")
     */
     function ajaxSubmit(url,method,params){ 	
         if(window.XMLHttpRequest){
      	   xmlhttp = new XMLHttpRequest();
         }else{     	  
      	   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
         }     
         //xmlhttp.onreadystatechange=ajaxCallbackProcess();这种写法是把ajaxCallbackProcess函数调用之后的结果
         //赋给xmlhttp.onreadystatechange,而不是把ajaxCallbackProcess函数对象本身赋给xmlhttp.onreadystatechange
         //而xmlhttp.onreadystatechange期待的值是函数对象本身而不是函数调用的值,大坑....折磨我2天....
         xmlhttp.onreadystatechange=ajaxCallbackProcess;//回调函数      
         xmlhttp.open(method, url, true);
         xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
         xmlhttp.send(params);  
     }
         
     function ajaxCallbackProcess(){//回调函数   	
    	window.alert(xmlhttp.readyState);
        window.alert(xmlhttp.status);
        window.alert(xmlhttp.statusText);
        if(xmlhttp.readyState==4 && xmlhttp.status ==200){
        	window.alert("回调函数");
  		    document.getElementById("username").value =xmlhttp.responseText;
  	    }
     }
     
    </script>
</body>
    <input type="button" name="diawo" value="发送ajax请求" οnclick='ajaxSubmit("TestAjaxServlet","POST","fname=Bill&lname=GATE");'>
    <input type="text" name="username" id="username">
</html>

注意:

         xmlhttp.onreadystatechange=ajaxCallbackProcess();这种写法是把ajaxCallbackProcess函数调用之后的结果
         赋给xmlhttp.onreadystatechange,而不是把ajaxCallbackProcess函数对象本身赋给xmlhttp.onreadystatechange
         而xmlhttp.onreadystatechange期待的值是函数对象本身而不是函数调用的值,大坑....折磨我2天....
         xmlhttp.onreadystatechange=ajaxCallbackProcess;//正确写法