Ajax load html page
jQuery ajax - load() 方法
实例
使用 AJAX 请求来改变 div 元素的文本：
$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});
定义和用法
load() 方法通过 AJAX 请求从服务器加载数据，并把返回的数据放置到指定的元素中。
注释：还存在一个名为 load 的 jQuery 事件方法。调用哪个，取决于参数。
语法
load(url,data,function(response,status,xhr))
参数
描述
url
规定要将请求发送到哪个 URL。
data
可选。规定连同请求发送到服务器的数据。
function(response,status,xhr)
可选。规定当请求完成时运行的函数。
额外的参数：
- response - 包含来自请求的结果数据
- status - 包含请求的状态（"success", "notmodified", "error", "timeout" 或 "parsererror"）
- xhr - 包含 XMLHttpRequest 对象
详细说明
该方法是最简单的从服务器获取数据的方法。它几乎与 $.get(url, data, success) 等价，不同的是它不是全局函数，并且它拥有隐式的回调函数。当侦测到成功的响应时（比如，当 textStatus 为 "success" 或 "notmodified" 时），.load() 将匹配元素的 HTML 内容设置为返回的数据。这意味着该方法的大多数使用会非常简单：
$("#result").load("ajax/test.html");
如果提供回调函数，则会在执行 post-processing 之后执行该函数：
$("#result").load("ajax/test.html", function() {
alert("Load was performed.");
});
上面的两个例子中，如果当前文档不包含 "result" ID，则不会执行 .load() 方法。
如果提供的数据是对象，则使用 POST 方法；否则使用 GET 方法。
加载页面片段
.load() 方法，与 $.get() 不同，允许我们规定要插入的远程文档的某个部分。这一点是通过 url 参数的特殊语法实现的。如果该字符串中包含一个或多个空格，紧接第一个空格的字符串则是决定所加载内容的 jQuery 选择器。
我们可以修改上面的例子，这样就可以使用所获得文档的某部分：
$("#result").load("ajax/test.html #container");
如果执行该方法，则会取回 ajax/test.html 的内容，不过然后，jQuery 会解析被返回的文档，来查找带有容器 ID 的元素。该元素，连同其内容，会被插入带有结果 ID 的元素中，所取回文档的其余部分会被丢弃。
jQuery 使用浏览器的 .innerHTML 属性来解析被取回的文档，并把它插入当前文档。在此过程中，浏览器常会从文档中过滤掉元素，比如 <html>, <title> 或 <head> 元素。结果是，由 .load() 取回的元素可能与由浏览器直接取回的文档不完全相同。
注释：由于浏览器安全方面的限制，大多数 "Ajax" 请求遵守同源策略；请求无法从不同的域、子域或协议成功地取回数据。
更多实例
例子 1
加载 feeds.html 文件内容：
$("#feeds").load("feeds.html");
例子 2
与上面的实例类似，但是以 POST 形式发送附加参数并在成功时显示信息：
$("#feeds").load("feeds.php", {limit: 25}, function(){
alert("The last 25 entries in the feed have been loaded");
});
例子 3
加载文章侧边栏导航部分至一个无序列表：
HTML 代码：
<b>jQuery Links:</b>
<ul id="links"></ul>
jQuery 代码：
$("#links").load("/Main_Page #p-Getting-Started li");
Ajax load html page的更多相关文章
- jQuery ajax Load关闭缓存的方法
[导读] 在jQuery ajax Load关闭缓存的方法很简单,我们只要在$ ajaxSetup中把cache: false就楞以了,当然我们还可以使用一个随机参数来实例了.简单介绍load(url ...
- Ubuntu下gdb远程调试--warning: Could not load vsyscall page because no executable was specified解决方案
1. 首先安装gdbserver apt-get install gdbserver 2. 编译-g 程序 gcc -g test_gdb.c -o test_gdb 源码如下: #include & ...
- jQuery Ajax(load,post,get,ajax)用法与详解
今天看到群里面有网友们问到Jquery Ajax的(load,post,get,ajax)之间的区别,现在整理了一篇文章出来,希望可以帮到网友们,首先我们先来看一些简单的方法, 这些方法都是对jQue ...
- 让浏览器支持 jquery ajax load 前进、后退 功能
BEGIN; 一般在做 ajax load 的时候,非常多人都不会考虑到须要浏览器支持前进后退功能,由于大部分人都不知道能够实现. 近期遇到这个问题,经过一小段研究,发现github已经有现成的开源工 ...
- 2-jQuery - AJAX load() 方法【进阶篇】
第一篇的AJAX load() 方法过于简单,补充一下,完整的. 格式 $(selector).load(URL,data,callback); 源码 <!DOCTYPE html> &l ...
- ajax load事件
ajax.load 使用ajax 来改变div元素文本. load( url [, data][, callback] ) load()方法的传递方式根据参数data来自动指定.如果没有参数传递,则 ...
- jQuery Ajax(load,post,get,ajax)
1.load(url, [data], [callback]) 载入远程 HTML 文件代码并插入至 DOM 中. 默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式.jQuery ...
- How to use Ajax on Visualforce page on Salesforce platform
Just use Ajax pattern to call object data from server on visualforce page. Following is the Asynchro ...
- jquery ajax load
jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector). ...
随机推荐
- Spring-注解控件介绍
1.@controller 控制器(注入服务) 2.@service 服务(注入dao) 3.@repository dao(实现dao访问) 4.@component (把普通pojo实例化到spr ...
- java基础2.0：Object、Class、克隆、异常编程
Java编程中两个重要的类Object 和 Class及java异常编程 (1)是所有Java类(API提供的类.自定义类)的最终父类. (2)作用:在JVM管理对象中的过程中,有一套统一的类型检查和 ...
- linux(本机)配置域名
hosts是一个没有扩展名的系统文件, 其作用就是将主机名映射到对应的ip地址. 当用户执行一条ping命令时(如ping www.abc.com),系统会首先自动从hosts文件中寻找www.abc ...
- BuiltWith
BuiltWith网站技术信息查询工具 利用该网站所提供的功能,你可以查询出某网站背后是由哪些技术来支持的, 比如操作系统的类型.所采用的访问量统计服务.采用的发布平台.广告平台.语言框架.聚合功能. ...
- java.sql.SQLException: 无效的列索引
java.sql.SQLException: 无效的列索引 "无效的列索引"其实是个低级的错误,原因无非几个: 1.sql串的?号数目和提供的变量数目不一致: 例如:jdbcTem ...
- Quality trimming using Trimmomatic
java -jar /home/liuhui/bin/trinityrnaseq_r20140413p1/trinity-plugins/Trimmomatic/trimmomatic.jar PE ...
- 如何提高redmine的访问速度
刚开始使用redmine时 方法一: 可以采用nginx+passenger的方式来驱动redmine提升访问速度,但是在新建问题或更新问题时变得非常慢,这是因为在新建问题和更新问题时会发送邮件,而且 ...
- Redis的复制(Master/Slave)
是什么 : 也就是我们所说的主从复制,主机数据更新后根据配置和策略,自动同步到备机的master/slaver机制,Master以写为主,Slave以读为主 能干嘛: 读写分离,容灾恢复 怎么玩: 1 ...
- ubuntu apt-get update失败 解决方法
ubuntu apt-get update失败 1.出现错误:E:Could not get lock /var/lib/apt/lists/lock - open (11: Resource tem ...
- UOJ261 【NOIP2016】天天爱跑步
本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000作者博客:http://www.cnblogs.com/ljh2000-jump/转 ...