jQuery之Ajax之一

这里先要讲下什么是Ajax。待续。

今天这里只讲Ajax请求的一部分,以后有用到别的在续写。

1、jQuery.get( url, [data], [callback] ):使用GET方式来进行异步请求。这个我之前是有用过滴。但理解有些偏差。这里先将下正确的。

url即要传递的地址、date是参数、callback是回调函数(只有当Response的返回状态是success才是调用该方法)。

注意点:

callback是得到的返回值(date)是由Response返回的,故在在类别修改是时候为什么要用:context.Response.Write("true");而不是return true。

我之前的修改类别名用的就是get方法,当时有用到了两个参数,其实是可以用date来传递的,然后还是用Required来获取。那么这个就没有什么好说的了,自己看之前写的。

 

2、jQuery.post(url,[date],[callback],[type]);

较之于get方法,好像多了个type。感觉跟get差不多。现在摘录下一网友的例子,设计的简单明了。

Response.ContentType = "application/json";
Response.Write("{result: '" + Request["Name"] + ",你好!(这消息来自服务器)'}");

jQuery代码:

$.post("Ajax.aspx", { Action: "post", Name: "lulu" },

function (data, textStatus){

// data 可以是 xmlDoc, jsonObj, html, text, 等等.
//this; // 这个Ajax请求的选项配置信息,请参考jQuery.get()说到的this
alert(data.result);

}, "json");

上面的type就是json了。

3、jQuery. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中。  

这个有点怪,如果不是现在IE下测试就会显示不出来。我怀疑出现浏览器兼容问题。下载吧我做的一个简单的:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript" src="../JS/jquery-1.3.2-vsdoc2.js"></script></head> 
<body> 

<input type="button" id="send" value="Ajax获取" /> 
<div id="resText" class=".ajax.load">
dddd
</div> 

<script type="text/javascript">
$(function(){
$("#send").click(function(){ 
$("#resText").load("test.html .para);
}
</script>
</body> </html>

下面自然是text.html了

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
</head> 
<body> 

<div class="comment"> 
已有评论: 
</div> 
<div class="comment"> 
<h6>张三:</h6> 
<p class="para">沙发。</p> 
</div> 
<div class="comment"> 
<h6>李四:</h6> 
<p class="para">板凳。</p> 
</div> 
<div class="comment"> 
<h6>王五:</h6> 
<p class="para">地板。</p> 
</div> 
</body> 
</html>

先做到这里,今天做得有点晕。

继续补充下,jQuery.getScript(url,callback) 第二参数个可选。

<body>
<button id="go">» Run</button>
<div class="block"></div> 
<script type="text/javascript">
$(function(){
jQuery.getScript("../JS/test.js", 
function(){
  $("#go").click(function(){
    $(".block").animate( { backgroundColor: 'pink' }, 1000)
      .animate( { backgroundColor: 'blue' }, 1000);
  });
});
//alert("sss");
})
 
 
</script>
</body>

我的test.js只是简单的做了个输出alert("ddd");

同上还是出现在IE可以在其他浏览器不行。

 

原文地址:https://www.cnblogs.com/huaizuo/p/2119480.html