$.load()的用法
jquery load 事件用法
如果绑定给window对象,则会在所有内容加载后触发,包括窗口,框架,对象和图像。如果绑定在元素上,则当元素的内容加载完毕后触发。
注意:只有当在这个元素完全加载完之前绑定load的处理函数,才会在他加载完后触发。如果之后再绑定就永远不会触发了。所以不要在$(document).ready()里绑定load事件,因为jQuery会在所有DOM加载完成后再绑定load事件。
调用load方法的完整格式是:
load( url, [data], [callback] ),
其中:
url
:是指要导入文件的地址。
data
:可选参数;因为Load不仅仅可以导入静态的html文件,还可以导入动态脚本,例如PHP文件,所以要导入的是动态文件时,我们可以把要传递的参数放在这里。
callback
:可选参数;是指调用load方法并得到服务器响应后,再执行的另外一个函数。
一:如何使用data
1.加载一个php文件,该php文件不含传递参数
$("#myID").load("test.php");
//在id为#myID的元素里导入test.php运行后的结果
2. 加载一个php文件,该php文件含有一个传递参数
$("#myID").load("test.php",{"name" : "Adam"});
//导入的php文件含有一个传递参数,类似于:test.php?name=Adam
3. 加载一个php文件,该php文件含有多个传递参数。注:参数间用逗号分隔
$("#myID").load("test.php",{"name" : "Adam" ,"site":"61dh.com"});
//导入的php文件含有一个传递参数,类似于:test.php?name=Adam&site=61dh.com
4. 加载一个php文件,该php文件以数组作为传递参数
$("#myID").load("test.php",{'myinfo[]', ["Adam", "61dh.com"]});
//导入的php文件含有一个数组传递参数。
注意:使用
load
,这些参数是以POST的方式传递的,因此在test.php里,不能用GET来获取参数。
二:如何使用callback
比如我们要在
load方法
得到服务器响应后,慢慢地显示加载的内容,就可以使用
callback
函数。代码如下:
$("#go").click(function(){
$("#myID").load("welcome.php", {"lname" : "Cai", "fname" : "Adam", function(){
$("#myID").fadeIn('slow');}
);
});
备注:
在看jQuery源码时发现的,拿出来和大家分享。在load的url里加上空格后面就可以跟选择器了。
举例:我需要load test.html的内容,并只要取id为a的内容。
$("body").load("test.html #a");
使用load的方法 放到body里面 可以用loading做包含文件 ----不错
<script type="text/javascript">
$("#left").load("xx.html");
$("#right").load("xxx.html");
</script>
随机推荐
- centos7.0 安装redis集群
生产环境下redis基本上都是用的集群,毕竟单机版随时都可能挂掉,风险太大.这里我就来搭建一个基本的redis集群,功能够用但是还需要完善,当然如果有钱可以去阿里云买云数据库Redis版的,那个还是很 ...
- 第六课 touch事件
1.移动端页面在PC上浏览时,限制宽度的方法: 2.移动端页面切换设备时自动刷新页面的方法: 3.touch事件 touchstart:当手指触摸屏幕时触发.通过addEventListener添加移 ...
- NoSql数据库初探-mongoDB环境搭建
NoSQL数据库一改关系型数据库的缺点,更容易的集成.分布式.无模式.故障恢复等特点,正在一步步餐食关系型数据库的市场,作为一个与时俱进的码农了解一下新技术是必须的,尤其是在读了<NoSql精粹 ...
- ListView中的setOnScrollListener
ListView是Android中最常用的控件之一,随着时代发展,RecyclerView有取代它的趋势,但是在一些老代码中,ListView依然扮演着重要的作用.项目中遇到一个需求,需要监听List ...
- [leetcode] 题型整理之cycle
找到环的起点. 一快一慢相遇初,从头再走再相逢.
- junit的学习
junit 是一种单元检测的工具包,他能解决的问题主要是有两点 : 1. 不用将方法都调到main方法去执行一次来看结果 2. 测试的结果可以不用我们人工去对比,这里主要使用的是junit的断言类 ...
- Node使用multiparty包上传文件
var multiparty = require('multiparty'); var http = require('http'); var util = require('util'); var ...
- Angular动画(ng-class)
ng-class 同 触发的是 addClass//当给元素添加一个class时触发, removeClass //把元素的class移除时触发 <ul ng-style="ulWid ...
- 【字符串匹配】KMP算法和next数组的c/c++实现
KMP算法基本思想有许多博客都写到了,写得也十分形象,不懂得可以参考下面的传送门,我就不解释基本思想了.本文主要给出KMP算法及next数组的计算方法(主要是很多网上的代码本人(相信应该是许多人吧)看 ...
- Android 中 LayoutInflater 的使用
一.LayoutInflater 的作用 我们一般使用 LayoutInflater 做一件事:View inflate(int resource, ViewGroup root); inflate( ...