load() 方法

  load() 是所有jQuery工具中最简单的,向它传入一个URL,它会异步加载URL内的内容,然后将内容插入每一个选中元素中,替换掉已经存在的任何内容。 例如

$("#load-div").load("getElementSize.html");

 

也可以获取URL文档的一部分内容, 页面后面添加元素,必须要加空格(不然有时候会被认为是hash#)。 只获取一个 id="p1"  的元素 在这条URL页面里面,然后替换load-div里面的内容。

$("#load-div").load("getElementSize.html #p1");

  

除了必须的URL参数,load()方法还接受两个可选参数。第一个表示的数据,可以追加到URL后面,或者与请求一起发送。如果传入的是字符串,则会追加到URL后面(放在“?” 或"&"  )。如果传入对象会被转化为一个用"&"分隔的名/值对后与请求一起发送。通常情况下,load()方法发送HTTP GET请求,但是如果传入数据对象,则它会发送POST请求。

//string
$("#load-div").load("getElementSize.html", { zipcode=01234 } ); //object
$("#load-div").load("getElementSize.html", { zipcode:01234, units: 'F' } );

  

load()的另一个选参数是回调函数。

$("#success").load("/not-here.php", function(response, status, xhr) {   //response content, status , XMLHttpRequest
 if (status == "success") {
console.log("success");
}   if (status == "error") {
var msg = "Sorry but there was an error: ";
$("#error").html(msg + xhr.status + " " + xhr.statusText);
}
});

  

回调函数第一个参数 response是返回的内容,

status 是状态参数,:

success: 表示请求成功完成

notmodified: 该状态码表示请求已经完成,但服务器返回的相应内容是HTTP 304 “Not Modified”,表示请求的URL内容和上次请求的相同,没有变化

error: 表示请求没有完成,原因是某些HTTP错误,更多细节,可以检查传入每一个回调函数中的XMLHttpRequest对象的HHTP状态码来获取

timeout: 如果Ajax请求没有在选定的超时区间内完成,会调用错误回调,并传入该状态码,默认情况下Jquery请求没有超时限定,只有指定了timeout选项时才能看到该状态码

parsererror: 该状态码表示HTTP请求已成功请求,但jQuery无法按照期望的方式解析。

jQuery Ajax 的 load()方式的更多相关文章

  1. jQuery Ajax url使用方式

    jQuery Ajax的使用场景: 页面需要通过后台逻辑,但只需要局部刷新以显示新的内容. jQuery Ajax url使用方式1.servlet方式: 需要在struts.xml中写一个actio ...

  2. jquery ajax的load()方法和load()事件

    1.使用 AJAX 请求来改变 div 元素的文本: $("button").click(function(){ $("div").load('demo_aja ...

  3. jquery Ajax的load、post、get、put、delete的用法

    1.load() load()方法是jquery中最简单和常用的Ajax方法,能载入远程html代码并插入到DOM中,结构为load( url [, data] [, callback]);     ...

  4. jQuery Ajax之load()方法

    jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$.getScript()和$.getJ ...

  5. Jquery ajax传递xml方式在ie8下兼容问题

    主要问题就是ie8把xml格式在打开的时候转换成了string,我们只用把其转换回xml就可以了. $.ajax({ type:’GET’, url:’list.php?pagenow=’+count ...

  6. jQuery Ajax(load,post,get,ajax)用法与详解

    今天看到群里面有网友们问到Jquery Ajax的(load,post,get,ajax)之间的区别,现在整理了一篇文章出来,希望可以帮到网友们,首先我们先来看一些简单的方法, 这些方法都是对jQue ...

  7. jQuery学习之jQuery Ajax用法详解

    jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...

  8. jQuery学习之jQuery Ajax用法详解(转)

    [导读] jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍.我们先从最简单的 ...

  9. [转]Jquery Ajax用法

    原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源:   时间 ...

随机推荐

  1. js正则表达式验证大全

    /判断输入内容是否为空    function IsNull(){        var str = document.getElementById('str').value.trim();      ...

  2. Js 通过点击改变css样式

    通过js 点击按钮去改变目标原始的背景颜色 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> ...

  3. Java安全发布的理解

    看<Java并发编程实战>遇到如下问题 代码: /** * Created by yesiming on 16/11/11. */public class Holder { private ...

  4. ExtJS智能提示工具spket安装与破解

    用myeclipse写java程序,最怕的是什么呢,写javascript代码,原因很简单,没有智能提示,ExtJS是完全js代码的界面库,写起来就更痛苦了,幸好有人做了spket插件,此文采用傻瓜式 ...

  5. Extjs嵌入html

    方式一:使用组件的html属性嵌入html代码,如果html代码中存在参数可以使用字符串拼接的方式拼接html代码. html页面: <!doctype html> <html> ...

  6. Websocket 与代理服务器如何交互? How HTML5 Web Sockets Interact With Proxy Servers

    How HTML5 Web Sockets Interact With Proxy Servers Posted by Peter Lubberson Mar 16, 2010 With the re ...

  7. jquery 导航栏目

    JS 文件<script type="text/javascript"> $(document).ready(function(){ $(".level1 & ...

  8. c#中方法out参数的使用

    一个很普通的例题,求出一个整型数组的最小值.最大值.总和.平均值,利用调用函数的方法来ut参数实现 using System; using System.Collections.Generic; us ...

  9. python logging模块使用

    近来再弄一个小项目,已经到收尾阶段了.希望加入写log机制来增加程序出错后的判断分析.尝试使用了python logging模块. #-*- coding:utf-8 -*- import loggi ...

  10. bzoj2534: Uva10829L-gap字符串

    Description 有一种形如uvu形式的字符串,其中u是非空字符串,且V的长度正好为L,那么称这个字符串为L-Gap字符串 给出一个字符串S,以及一个正整数L,问S中有多少个L-Gap子串. I ...