jQuery - AJAX load() 实例用法详解


Posted in jQuery onAugust 27, 2019

jQuery load() 方法是简单但强大的 AJAX 方法。

load() 方法从服务器加载数据,并把返回的数据放入被选元素中。

语法:

$(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

可选的 callback 参数是 load() 方法完成后所执行的函数名称。

这是示例文件("demo_test.txt")的内容:

<h2>jQuery AJAX 是个非常棒的功能!</h2> <p id="p1">这是段落的一些文本。</p>
下面的例子会把文件 "demo_test.txt" 的内容加载到指定的 <div> 元素中:

实例

$("#div1").load("demo_test.txt");

尝试一下 »

也可以把 jQuery 选择器添加到 URL 参数。

下面的例子把 "demo_test.txt" 文件中 id="p1" 的元素的内容,加载到指定的 <div> 元素中:

实例

$("#div1").load("demo_test.txt #p1");

尝试一下 »
可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数:

  • responseTxt - 包含调用成功时的结果内容
  • statusTXT - 包含调用的状态
  • xhr - 包含 XMLHttpRequest 对象

下面的例子会在 load() 方法完成后显示一个提示框。如果 load() 方法已成功,则显示"外部内容加载成功!",而如果失败,则显示错误消息:

实例

$("button").click(function(){ $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){ if(statusTxt=="success") alert("外部内容加载成功!"); if(statusTxt=="error") alert("Error: "+xhr.status+": "+xhr.statusText); }); });

感谢大家的阅读和对三水点靠木的支持。

jQuery 相关文章推荐
jQuery加密密码到cookie的实现代码
Apr 18 jQuery
jQuery使用JSONP实现跨域获取数据的三种方法详解
May 04 jQuery
jquery图片放大镜效果
Jun 23 jQuery
jQuery实现的模仿雨滴下落动画效果
Dec 11 jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
JQuery中queue方法用法示例
Jan 31 jQuery
jquery树形插件zTree高级使用详解
Aug 16 jQuery
jquery将json转为数据字典的实例代码
Oct 11 jQuery
jquery获取input输入框中的值
Nov 13 jQuery
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 jQuery
如何基于jQuery实现五角星评分
Sep 02 jQuery
jquery实现鼠标悬浮弹出气泡提示框
Dec 23 jQuery
jQuery实现判断滚动条滚动到document底部的方法分析
Aug 27 #jQuery
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 #jQuery
Jquery实现获取子元素的方法分析
Aug 24 #jQuery
jquery分页优化操作实例分析
Aug 23 #jQuery
jquery实现的分页显示功能示例
Aug 23 #jQuery
jQuery表单选择器用法详解
Aug 22 #jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 #jQuery
You might like
PHP 创建文件(文件夹)以及目录操作代码
2010/03/04 PHP
PHP基础学习小结
2011/04/17 PHP
mysql_num_rows VS COUNT 效率问题分析
2011/04/23 PHP
javascript 类定义的4种方法
2009/09/12 Javascript
javascript 二进制运算技巧解析
2012/11/27 Javascript
extjs关于treePanel+chekBox全部选中以及清空选中问题探讨
2013/04/02 Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
2013/04/26 Javascript
Jquery中offset()和position()的区别分析
2015/02/05 Javascript
JavaScript的9种继承实现方式归纳
2015/05/18 Javascript
基于javascript html5实现3D翻书特效
2016/03/14 Javascript
JQuery fileupload插件实现文件上传功能
2016/03/18 Javascript
Vue中computed与methods的区别详解
2018/03/24 Javascript
详解Vue基于 Nuxt.js 实现服务端渲染(SSR)
2018/04/05 Javascript
Javascript实现时间倒计时功能
2018/11/17 Javascript
nuxt静态部署打包相对路径操作
2020/11/06 Javascript
用vue设计一个日历表
2020/12/03 Vue.js
JavaScript事件概念详解(区分静态注册和动态注册)
2021/02/05 Javascript
[01:16:13]DOTA2-DPC中国联赛 正赛 SAG vs Dragon BO3 第一场 2月22日
2021/03/11 DOTA
Python中的测试模块unittest和doctest的使用教程
2015/04/14 Python
python生成随机密码或随机字符串的方法
2015/07/03 Python
简单的Apache+FastCGI+Django配置指南
2015/07/22 Python
python实现发送和获取手机短信验证码
2016/01/15 Python
Python中的FTP通信模块ftplib的用法整理
2016/07/08 Python
浅谈Python peewee 使用经验
2017/10/20 Python
python实现m3u8格式转换为mp4视频格式
2018/02/28 Python
python开发游戏的前期准备
2019/05/05 Python
浅析python内置模块collections
2019/11/15 Python
Pytorch之parameters的使用
2019/12/31 Python
python基于Kivy写一个图形桌面时钟程序
2021/01/28 Python
html5 迷宫游戏(碰撞检测)实例一
2013/07/25 HTML / CSS
全球速卖通:AliExpress(国际版淘宝)
2017/09/20 全球购物
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
基层党支部承诺书
2015/04/30 职场文书
2015年国庆节广播稿
2015/08/19 职场文书
python实现的人脸识别打卡系统
2021/05/08 Python
Go 内联优化让程序员爱不释手
2022/06/21 Golang