使用load()方法异步请求数据

使用load()方法通过Ajax请求加载服务器中的数据，并把返回的数据放置到指定的元素中，它的调用格式为：

load(url,[data],[callback])

参数url为加载服务器地址，可选项data参数为请求时发送的数据，callback参数为数据请求成功后，执行的回调函数。

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3     <head>
 4         <title>使用load()方法异步请求数据</title>
 5         <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
 6         <link href="style.css" rel="stylesheet" type="text/css" />
 7     </head>
 8     
 9     <body>
10         <div id="divtest">
11             <div class="title">
12                 <span class="fl">我最爱吃的水果</span> 
13                 <span class="fr">
14                     <input id="btnShow" type="button" value="加载" />
15                 </span>
16             </div>
17             <ul></ul>
18         </div>
19         
20         <script type="text/javascript">
21             $(function () {
22                 $("#btnShow").bind("click", function () {
23                     var $this = $(this);
24                     $("ul").load("./fruit.html",function(){
25                         $this.attr("disabled", "true");
26                     });
27                 })
28             });
29         </script>
30     </body>
31 </html>
View Code
1 <ul>
2     <li>橘子</li>
3     <li>香蕉</li>
4     <li>葡萄</li>
5     <li>苹果</li>
6 </ul>
View Code

 

posted @ 2015-02-23 13:53  煎饼馃子  阅读(202)  评论(0)  编辑  收藏  举报