jquery load事件(callback/data)使用方法及注意事项_jquery

如果绑定给window对象,则会在所有内容加载后触发,包括窗口,框架,对象和图像。如果绑定在元素上,则当元素的内容加载完毕后触发。

注意:只有当在这个元素完全加载完之前绑定load的处理函数,才会在他加载完后触发。如果之后再绑定就永远不会触发了。所以不要在$(document).ready()里绑定load事件,因为jQuery会在所有DOM加载完成后再绑定load事件。因此,使用load方法时尽量把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=Adam3. 加载一个php文件,该php文件含有多个传递参数。注:参数间用逗号分隔
$("#myID").load("test.php",{"name" : "Adam" ,"site":"61dh.com"});
//导入的php文件含有一个传递参数,类似于:test.php?name=Adam&site=61dh.com4. 加载一个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');}
);
});

备注:
在load的url里加上空格后面就可以跟选择器了。
例如:

复制代码 代码如下:

$("body").load("test.html #a");

时间: 2024-11-02 12:57:29

jquery load事件(callback/data)使用方法及注意事项_jquery的相关文章

jQuery检查事件是否触发的方法

  本文实例讲述了jQuery检查事件是否触发的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 $('button').click(function(event, wasTriggered) { if (wasTriggered) { alert('triggered in code'); } else { alert('triggered by mouse'); } }); $('button').trigger('click', true); 希望本文所述

jQuery检查事件是否触发的方法_jquery

本文实例讲述了jQuery检查事件是否触发的方法.分享给大家供大家参考.具体实现方法如下: $('button').click(function(event, wasTriggered) { if (wasTriggered) { alert('triggered in code'); } else { alert('triggered by mouse'); } }); $('button').trigger('click', true); 希望本文所述对大家的jQuery程序设计有所帮助.

关于JQuery($.load)事件的用法和分析_jquery

首先我们需要清楚的是jquery load方法是对jQuery.ajax()进行封装以方便我们使用的一个方法,当我们需要处理较为复杂的逻辑时候,还是需要用到jQuery.ajax()这个比较全面的方法的. 调用load方法的完整语法格式:load( url, [data], [callback] )其中:url是指要导入文件的地址.data:可选参数:因为load不仅仅可以导入静态的html文件,还可以导入动态脚本,例如PHP文件,所以要导入的是动态文件时,我们可以把要传递的参数放在这里.cal

jQuery使用$.ajax进行异步刷新的方法(附demo下载)_jquery

本文实例讲述了jQuery使用$.ajax进行异步刷新的方法.分享给大家供大家参考,具体如下: 最近要用到jquery进行异步读取数据的功能,jquery提供了许多内置的异步读取函数,给大家演示下最常用的$.ajax用法 在客户端文本框输入一个内容,然后在服务器端返回时间 在DEMO中要用到ashx文件,用于获取服务器的信息 效果图片 escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串. 客户端代码 <%@ Page Language="C#" Au

jquery解析json格式数据的方法(对象、字符串)_jquery

本文实例讲述了jquery解析json格式数据的方法.分享给大家供大家参考,具体如下: json数据是我们常用的一种小型的数据实时交换的一个东西,他可以利用jquery或js进行解析,下面我来介绍jquery解析json字符串方法. 一.jQuery解析Json数据格式: 使用这种方法,你必须在Ajax请求中设置参数: dataType: "json" 获取通过回调函数返回的数据并解析得到我们想要的值,看源码: jQuery.ajax({ url: full_url, dataType

jquery拖拽排序简单实现方法(效果增强版)_jquery

本文实例讲述了jquery拖拽排序简单实现方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 原来没有新建动作,分析代码后发现很容易增强~~ 代码如下: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>测试的拖拽功能</title

jQuery中animate的几种用法与注意事项_jquery

一.animate语法结构 animate(params,speed,callback) params:一个包含样式属性及值的映射,比如{key1:value1,key2:value2} speed:速度参数[可选] callback:在动画完成时执行的函数[可选] 二.自定义简单动画 用一个简单例子来说明,实现单击某div在页面上横向飘动的效果. <style> #cube{ position:relative;/* 不加这句元素不能动 */ width:30px; height:30px;

jQuery.load()事件使用方法详解

.load( url, [ data ], [ complete(responseText, textStatus, XMLHttpRequest) ] ) 返回: jQuery 描述: 载入远程 HTML 文件代码并插入至 DOM 中. version added: 1.0.load( url, [ data ], [ complete(responseText, textStatus, XMLHttpRequest) ] ) url一个包含发送请求的URL字符串 data向服务器发送请求的K

JQuery入门——事件切换之toggle()方法应用介绍_jquery

1.在toggle()方法中,可以依次调用N个指定的函数,直到最后一个函数,然后重复对这个函数轮番调用,其语法如下:toggle(fn, fn2, [fn3, fn4,...]),其中fn.fn2.fn3.fn4等函数依次调用. 2.示例代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-