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

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

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

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

     <head>

         <title>使用load()方法异步请求数据</title>

         <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

         <link href="style.css" rel="stylesheet" type="text/css" />

     </head>

     <body>

         <div id="divtest">

             <div class="title">

                 <span class="fl">我最爱吃的水果</span>

                 <span class="fr">

                     <input id="btnShow" type="button" value="加载" />

                 </span>

             </div>

             <ul></ul>

         </div>

         <script type="text/javascript">

             $(function () {

                 $("#btnShow").bind("click", function () {

                     var $this = $(this);

                     $("ul").load("./fruit.html",function(){

                         $this.attr("disabled", "true");

                     });

                 })

             });

         </script>

     </body>

 </html>
 <ul>

     <li>橘子</li>

     <li>香蕉</li>

     <li>葡萄</li>

     <li>苹果</li>

 </ul>

使用load()方法异步请求数据的更多相关文章

  1. jQuery基础（Ajax，load()，getJSON()，getScript()，post()，ajax()，同步/异步请求数据）

    1.使用load()方法异步请求数据   使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:   load(url,[data],[callba ...

  2. 解决ajax异步请求数据后swiper不能循环轮播(loop失效)问题、滑动后不能轮播的问题。

    问题描述: 1.我使用axios异步请求后台的图片进行渲染后不能实现循环轮播,也就是loop失效,但是静态写死的情况下不会出现这种问题. 2. 分析: swiper的机制是:初始化的时候将swiper ...

  3. python爬虫（3）——用户和IP代理池、抓包分析、异步请求数据、腾讯视频评论爬虫

    用户代理池 用户代理池就是将不同的用户代理组建成为一个池子,随后随机调用. 作用:每次访问代表使用的浏览器不一样 import urllib.request import re import rand ...

  4. 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串

    cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...

  5. 微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading等.如果需要同步处理,可以使用如下方法: 注意: Async ...

  6. jquery load 方法回显数据

    使用jQuery对象.load()方法 load() 方法的作用是可以通过 AJAX 请求从服务器加载数据,并把返回的数据直接放置到指定的元素中. 该方法使用起来非常简单,大大简化了ajax开发 语法 ...

  7. WeChat-SmallProgram：微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading 等.如果需要同步处理,可以使用如下方法: 提示:Async ...

  8. Vuex异步请求数据通过computed计算属性值

    问题描述: 使用Vuex管理数据时,在组件内使用$emit分发事件后,获取回来的数据要自动更新到该组件内,需要使用computed来计算更新. 一开始尝试使用赋值给data的方法,后来发现重新发起aj ...

  9. vuejs之v-if-ajax异步请求数据遇到的坑

    场景: params是异步请求获得的数据是一个对象,对象中又有chefHealthInfos数组 渲染时候会报错: 分析: 这是因为可以把v-if看成渲染了两次,两次结果params分别为{},{ch ...

随机推荐

  1. nginx作反向代理，实现负载均衡

    nginx作反向代理,实现负载均衡按正常的方法安装好 ngixn,方法可参考http://www.cnblogs.com/lin3615/p/4376224.html其中作了反向代理的服务器的配置如下 ...

  2. 身处IT的你对身边人都有哪些影响

    前不久,跟外甥一起吃饭:他明年就要中考了,我就想,这马上就到人生的关键路口了,看他自己对将来有什么想法没:就问了句:勇勇,你以后想学习哪些方面的东西或者想从事什么工作呢?他简单的说了句:我要跟你一样学 ...

  3. cppcheck使用

    一.splint介绍 splint是一个动态检查C语言程序安全弱点和编写错误的程序.splint会进行多种常规检查,包括未使用的变量,类型不一致,使用未定义变量,无法执行的代码,忽略返回值,执行路径未 ...

  4. 从零开始学ios开发（十四）：Navigation Controllers and Table Views（上）

    这一篇我们将学习一个新的控件Navigation Controller,很多时候Navigation Controller是和Table View紧密结合在一起的,因此在学习Navigation Co ...

  5. telnet命令判断端口是否通不通

    以上得出结论80端口不通 如果连接成功,想要退出telnet的话,ctrl+],然后输入quit 查看iptables vi /etc/sysconfig/iptables   #编辑防火墙配置文件  ...

  6. ServiceStack.OrmLite 调用存储过程

    最近在做关于ServiceStack.OrmLite调用存储过程时,有问题.发现ServiceStack.OrmLite不能调用存储过程,或者说不能实现我想要的需求.在做分页查询时,我需要传入参数传出 ...

  7. How to: Add Missing ContentPlaceHolder

    In Microsoft SharePoint Server 2010, the BlueBand master page is not supported in the Search Center ...

  8. Sublime Text 2 入门

    SublimeText 2 的介绍视频: http://player.youku.com/player.php/partnerid/XOTcy/sid/XMzU5NzQ5ODgw/v.swf   以下 ...

  9. 如何编写好的jQuery代码

    本文就是自己看,如果您不小心进到了这里,请看源处,是这个作者翻译的:http://blog.sae.sina.com.cn/archives/4157 讨论jQuery和javascript性能的文章 ...

  10. C# WPF打印报表

    前天我的一个同学由于打印报表而苦恼,所以就介绍了一下WPF的打印报表,希望能帮助到大家. 展示报表 1. 首先新建项“报表”,选定项目,右击,点击“添加”->“新建项”->“报表”