Ajax(1) load()

Ajax:Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

AJAX 不是新的编程语言,是技术的集合;主要技术有:javaScript、XMLHttpRequest、...。

AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。

load(url, [data][callback]方法:

url:待装入 HTML 网页网址。

data:发送至服务器的 key/value 数据。在jQuery 1.3中也可以接受一个字符串了。

callback:载入成功时回调函数。

例一:

 1 index.html:
 2  <input type="button" value="异步获取数据" /><br />
 3  <b>jQuery Links:</b>
 4  <ul id="links"></ul>
 5
 6
 7
 8 js:
 9
10   $(function(){
11           $(‘input‘).click(function () {
12
13              //$(‘#links‘).load(‘test.htm‘); //加载且显示了test.htm中的全部内容
14              $(‘#links‘).load(‘test.htm #one‘);//加载了test.htm中的全部内容,但只显示id=one下的内容
15          });
18  });
19
20
21 test.htm:
22 <li id="one">Test web one</li>
23 <li id="two">Test web two</li>

例二:(传参)

 $(function(){
       $(‘input‘).click(function () {
             $(‘#links‘).load(‘test.jsp‘,{              url:‘html/head.jsp‘,  //以键值对的形式传参,post方式                    title:‘com.mju‘        });
       });
 });

例三:(回调函数)

$(function(){
  $(‘input‘).click(function () {
    $(‘#links‘).load(
      ‘test.jsp‘,
      {url:‘html/head.jsp‘},
      function (response, status, xhr) { //xhr是XMLHttpRequest 对象
        alert(‘返回的值为:‘ + response + ‘,状态为:‘ + status + ‘,状态是:‘ + xhr.statusText);
      });
    });
});

注意:status 得到的值,如果成功返回数据则为:success,否则为:error。XMLHttpRequest
对象属于JavaScript 范畴,可以调用一些属性如下:
    属性名                                         说明
responseText                           作为响应主体被返回的文本
responseXML                            如果响应主体内容类型是"text/xml"或"application/xml",则返回包含响应数据的XML DOM 文档
status                                     响应的HTTP 状态
statusText                               HTTP 状态的说明

如果成功返回数据,那么xhr 对象的statusText 属性则返回‘OK‘字符串。除了‘OK‘的状态
字符串,statusText 属性还提供了一系列其他的值,如下:

HTTP                状态码状态字符串                    说明
200                         OK                            服务器成功返回了页面
400                   Bad Request                    语法错误导致服务器不识别
401                   Unauthorized                   请求需要用户认证
404                   Not found                        指定的URL 在服务器上找不到
500               Internal Server Error             服务器遇到意外错误,无法完成请求
503                 ServiceUnavailable               由于服务器过载或维护导致无法完成请求

时间: 2024-12-30 09:53:06

Ajax(1) load()的相关文章

jquery中ajax方法load get post与脚本文件如php脚本连接时,脚本怎样接受数据?

例如jquery实现ajax,用load()方法 $("div").load("gethint.php",{username:'mars'}); 则在php脚本gethint.php中用$_POST[]来接受数据,load()用post方式传送数据. 用$.get()方法时用$_GET[]接受 用$.post方法时用$_POST接受

jquery中页面Ajax方法$.load的功能

load语法 $(".selector").load("url", function(responseText, statusText, xmlhttprequest)); 可以做到加载一个页面的时候,如果发生错误,根据statusText给出的状态,显示对应的提示,这对用户来说非常重要. 例子,load post 代码如下 复制代码 <div id=btnAjaxPost>点击我</div><div id=divResult>内

jQuery教程 - Ajax之load()方法

jQuery教程 - Ajax之load()方法 标签: jqueryajaxxmlhttprequesthtmlcallback 2009-10-05 14:54 3700人阅读 评论(3) 收藏 举报  分类: jQuery(7)  版权声明:本文为博主原创文章,未经博主允许不得转载. jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是laod().$.get()和$.post()方法,第3层是$.getScript()和$.getJSON(

Ajax的load方法演示

load方法的参数形式为: load(url,[data],[callback]); 其中url为请求HTML页面的URL地址.[data]表示发送至服务器的key/value数据.callback表示请求完成时的回调函数,无论请求成功或者失败. 下面的实例就演示了关于Ajax的load方法来请求另一个页面的内容. 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 2 "http://www.w3.org/TR/ht

jQuery基础(Ajax,load(),getJSON(),getScript(),post(),ajax(),同步/异步请求数据)

1.使用load()方法异步请求数据 使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为: load(url,[data],[callback]) 参数url为加载服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数. 2.使用getJSON()方法异步加载JSON格式数据 使用getJSON()方法可以通过Ajax异步请求的方式,获取服务器中的数据,并对获取的数据进行解析,显示在页面中,它的

jQuery加载外部文件的方式get、post、ajax、load的区别及异步加载的实现

一.$.post(url, [data], [callback], [type])  url (String) : 发送请求的URL地址. data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示. callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法). type (String) : (可选)官方的说明是:Type of data to be sent.其实应该为客户

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

1.load() load()方法通常用来从服务器上获取静态的数据文件. 项目中如果需要传递一些参数给服务器,可以使用$.get()或者$.post()方法或者$.ajax()方法 2.$.get() $.get()  使用get方式进行异步请求,结构为$.get(url,[data],[callback]); 说明:url为请求地址, data为请求数据,可以是对象({key:value})格式,也可以拼接到url后面, callback为请求成功后的回调函数,服务器返回的是字符串 $.get

测开之路一百五十三:ajax之load、get、ajax在项目中的体现

在查询的时候是使用ajax进行请求的 目录结构 personal.models from datetime import datetimefrom flask_sqlalchemy import SQLAlchemy db = SQLAlchemy() class Department(db.Model): """ 部门 """ __tablename__ = 'department' # primary_key=True:主键, autoinc

黑马day18 jquery高级特性&amp;Ajax的load方法

介绍jquery中的load方法: (1).前面没有jquery.修饰,可以推断出他是一个普通的非全局函数(也就是说是一个局部函数):$.,$().,jquery.等修饰的就是全局函数,没有这些修饰的就是局部函数. (2).$(expr).load(url,data,callback); url:请求路径,绝对路径或者相对路径都可以. data: 请求参数,格式必须是key/value格式(json格式) callback:回调函数.function(data,textStatus,XMLHtt