jquery 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>

随机推荐

  1. (转)java redis使用之利用jedis实现redis消息队列

    应用场景 最近在公司做项目,需要对聊天内容进行存储,考虑到数据库查询的IO连接数高.连接频繁的因素,决定利用缓存做. 从网上了解到redis可以对所有的内容进行二进制的存储,而java是可以对所有对象 ...

  2. hbase 简单操作

    创建一个表 hbase(main):001:0> create 'student', 'name' 0 row(s) in 14.0260 seconds => Hbase::Table ...

  3. java求字符串数组交集、并集和差集

    import java.util.HashMap; import java.util.HashSet; import java.util.LinkedList; import java.util.Ma ...

  4. tp框架之函数调用

    1.如果要在一个方法里面调用另一个方法,可以先用A方法实例化控制器 $m = A("控制器名"); ,然后根据方法名调用 $m->方法名(可传参数); 2.自定义函数库  ( ...

  5. JS模块化

    一.原始写法 /* 模块就是实现特定功能的一组方法. 只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块. 上面的函数m1()和m2(),组成一个模块.使用的时候,直接调用就行了. ...

  6. ORA-12638:身份证明检索失败

    本地Sqlplus 连一远程数据库,出现 ORA-12638: 身份证明检索失败,pl/sql developer 也是同样的问题,tnsping 是没有问题的. 找到本地的sqlnet.ora文件, ...

  7. 前端试题本(HTML+CSS篇)

    CS1. 下面关于IE.FF下面CSS的解释区别描述正确的有?(不定项)CS2请选出结构正确的选项CS3.下面哪些是HTML5 新增的表单元素?CS4在使用table表现数据时,有时候表现出来的会比自 ...

  8. UWP学习记录11-设计和UI

    UWP学习记录11-设计和UI 1.输入和设备 通用 Windows 平台 (UWP) 中的用户交互组合了输入和输出源(例如鼠标.键盘.笔.触摸.触摸板.语音.Cortana.控制器.手势.注视等)以 ...

  9. 听大神说:https和http有何区别?(转)

    在做雅虎的时候,发现用第三方工具截取不到客户端与服务端的通讯,以前重来没碰到过这种情况,仔细看了看,它的url请求时基于https的,gg了下发现原来https协议和http有着很大的区别.总的来说, ...

  10. ExtJS 中类的选项 - config

    首先看一个例子,我们在ExtJS中定义一个Window对象,代码如下: var win = Ext.create("Ext.window.Window", { title: '示例 ...