码迷,mamicode.com
首页 > Web开发 > 详细

ajax的两种实现

时间:2019-06-17 20:20:23      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:query   缓存   col   color   失败   pen   nbsp   响应   两种   

1、通过jQuery发起Ajax请求

 1 <script type="text/javascript"
 2     src="${pageContext.request.contextPath}/js/jquery.min.js">
 3     
 4 </script>
 5 <script type="text/javascript">
 6     setInterval("AjaxJquery()", 3000);
 7     function AjaxJquery() {//通过jQuery发起请求
 8         $.ajax({
 9             url : "${pageContext.request.contextPath}/ajax_do",
10             type : "get",
11             error:function(){
12                 alert("请求失败");
13             },
14             success : function(msg) {
15                 $("#msg").append(msg);
16             }
17         });
18     }
19 </script>

setInterval(调用的方法,每个多少毫秒发起)
url:发送请求的地址
type:请求方式
cache:缓存(false每次都清空缓存)
error:请求失败
success:请求后回调函数

2、通过原生的XmlHttpRequest发起请求

 1 <script type="text/javascript"
 2     src="${pageContext.request.contextPath}/js/jquery.min.js">
 3     
 4 </script>
 5 <script type="text/javascript">
 6     setInterval("Ajax()", 3000);
 7 function Ajax(){//通过XMLHttpRequest发起请求
 8         var xmlhttp = new XMLHttpRequest();//创建XMLHttpRequest对象
 9         xmlhttp.open("post","${pageContext.request.contextPath}/ajax_do",true);
10         xmlhttp.send();
11         //接收服务器返回数据
12         xmlhttp.onreadystatechange=function(){
13             if(xmlhttp.readyState==4&&xmlhttp.status==200){
14                 //得到服务端响应
15                 $("#msg").append(xmlhttp.responseText);
16             }
17         }
18     }
19 </script>

 

ajax的两种实现

标签:query   缓存   col   color   失败   pen   nbsp   响应   两种   

原文地址:https://www.cnblogs.com/lingdu9527/p/11041908.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!