js ajax XMLHttpRequest与jq $.ajax

xmlhttprequest 对象的方法与属性
 


方    法

描    述

abort()

停止当前请求

getallresponseheaders()

把http请求的所有响应首部作为键/值对返回

getresponseheader("header")

返回指定首部的串值

open("method", "url")

建立对服务器的调用。method参数可以是get、post或put。url参数可以是相对url或绝对url。这个方法还包括3个可选的参数

send(content)

向服务器发送请求

setrequestheader("header", "value")

把指定首部设置为所提供的值。在设置任何首部之前必须先调用open()

  属  性

描    述

onreadystatechange

每个状态改变时都会触发这个事件处理器,通常会调用一个网页特效函数

readystate

请求的状态。有5个可取值:0 = 未初始化,1 = 正在加载,2 = 已加载,3 = 交互中,4 = 完成

responsetext

服务器的响应,表示为一个串

responsexml

服务器的响应,表示为xml。这个对象可以解析为一个dom对象

status

服务器的http状态码(200对应ok,404对应not found(未找到),等等)

statustext

http状态码的相应文本(ok或not found(未找到)等等)

<script type="text/javascript">
6 var req;
7         function sendtime() {
8             var url = "ajaxserver.asp教程x";
9             if (window.xmlhttprequest) //非ie浏览器及ie7(7.0及以上版本),用xmlhttprequest对象创建
10             {
11                 req = new xmlhttprequest();
12             }
13             else if (window.activexobject) //ie(6.0及以下版本)浏览器用activexobject对象创建,如果用户浏览器禁用了activex,可能会失败.
14             {
15                 req = new activexobject("microsoft.xmlhttp");
16             }
17             if (req) {
18                 xmlhttp.open("post", url, false);
19                 xmlhttp.onreadystatechange = function () {
20                     if (xmlhttp.readystate == 4) {
21                         if (xmlhttp.status == 200) {
22                             document.getelementbyid("txttime").value = xmlhttp.responsetext;
23                         }
24                         else {
25                             alert('ajax错误');
26                         }
27                     }
28                 }
29                 xmlhttp.send();
30             }
31         }
32
33     </script>
34 </head>
35 <body>
36     <input id="txttime" type="text" /><input id="btn1" type="button" value="ajax" onclick="sendtime()" />
37 </body>
jquery ajax

ajax.request(
url,
{
method:method,
parameters:para,
postbody:xmlstring,
asynchronous:true,
setrequestheader:object,
oncomplete:completefun,
onerror:errorfun
}
)
发送异步请求。(此方法是为兼容 prototype.js 而写,调用风格与 prototype 一致,使用ajax.request此方法请在页面中加载此js文件)

参数
url
必选项。数据发送的目标地址。
method
可选项。数据提交的方式,默认值为get。常用的还有post。
parameters
当 method 为 get 时是可选项,为 post 时是必选项。发送的数据,其形式为: name1=valeu1& name2=value2&name3=value3......
postbody
可选项。客户端发送的 xml 格式字符串。如果启用 postbody,那么 parameters 将被忽略。
asynchronous
可选项。指定请求是否异步,默认为true(异步)。
setrequestheader
指定请求的头部字串。其值类型为“名称值对”形式的对象,比如:{"if-modified-since":"0", "soapaction":"http://tempuri.org/sbs_webservice", ... ... }
oncomplete
可选项。请求成功时执行的回调函数,该函数默认把当前使用 xmlhttp 对象作为第一个参数。
onerror
可选项。请求异常时执行的回调函数,该函数默认把当前使用 xmlhttp 对象作为第一个参数。
返回值
当前使用的 xmlhttp 对象。

描述
发送异步请求,并返回 xmlhttp 对象,该对象内置有 abort() 方法,用于提前终止请求。异步请求成功则执行 oncomplete,失败则执行 onerror 。并返回 xmlhttp 对象。
ajax.request 是个接口完整的 ajax 方法,是 myjsframe 中所有其他 ajax 方法的核心方法。

示例
示例一:
<script type="text/javascript" >
   var myajax = new ajax.request(
        "http://www.111cn.net ",
        {
            method:"post",       //表单提交方式
            parameters:"name=acai&age=26&sex=male",   //提交的表单数据
            setrequestheader:{"if-modified-since":"0"},     //禁止读取缓存数据
            oncomplete:function(x){    //提交成功回调
                    alert(x.responsetext);
            },
            onerror:function(x){          //提交失败回调
                    alert(x.statustext);
            }
        }
   );
</script>

注:parameters 参数若是不列出,我们在开发中对于form 表单这样的数据 可以这样处理

 parameters:form.serialize('formname')   formname  为页面中表单的 id

时间: 2024-09-02 14:14:30

js ajax XMLHttpRequest与jq $.ajax的相关文章

js 兼容多浏览器的Ajax请求代码示例

例  代码如下 复制代码 var ajax = function() {}; ajax.prototype = {     request: function(method, url, callback, postVars) {         var xhr = this.createXhrObject();         xhr.onreadystatechange = function() {             if (xhr.readyState !== 4) return;  

原生js仿jquery实现对Ajax的封装_javascript技巧

前言 与js相比,jquery为我们省去了冗长的获取元素的代码,不用考虑一些麻烦的兼容问题,更加方便的动画实现,以及更加方便的方法调用让我们觉得jquery真是越用越舒服.但是jquery说到底还是对js的封装,我们不光要用的舒服还要深入理解其中的原理,这样才能更好的使用它. 首先我们封装的函数为了能实现可传入无限多个参数,在使用我们即将封装的函数时,需要使用对象进行传参,形式如下: //data作为参数传入我们下面封装的函数 var data = { //数据 user:"yonghu1&qu

js实现简单实用的AJAX完整实例_AJAX相关

本文实例讲述了js实现简单实用的AJAX的方法.分享给大家供大家参考,具体如下: //版权归属 WUJXPING //ajax 1.2 //更新2012-2-20 //1.异步数据加载可以进行加载方式get,post的设定 //2.异步同步模式的属性设定 //3.数据加载自动超时设置 //4.***数据加载事件的添加,通过事件可以进行服务器数据的实时处理 //5.增加回调函数中用户自定义参数this.e //6.增加ajax反复提交控制,只需将ajax对象定义为全局变量,每次提交都会进行等待上次

js实现简单实用的AJAX完整实例

本文实例讲述了js实现简单实用的AJAX的方法.分享给大家供大家参考,具体如下: //版权归属 WUJXPING //ajax 1.2 //更新2012-2-20 //1.异步数据加载可以进行加载方式get,post的设定 //2.异步同步模式的属性设定 //3.数据加载自动超时设置 //4.***数据加载事件的添加,通过事件可以进行服务器数据的实时处理 //5.增加回调函数中用户自定义参数this.e //6.增加ajax反复提交控制,只需将ajax对象定义为全局变量,每次提交都会进行等待上次

解决js数据包含加号+通过ajax传到后台时出现连接错误

测试过程中发现js数据包含加号+通过ajax传到后台时出现连接错误,删除+,链接畅通了,果然是这块问题,对加号进行转义 昨天有人提出一个bug,说"B+侦探"和"C+侦探"不能看,我当时很郁闷,因为其他资源是可以播放的,为什么这个不能播放,而且电影名称我都是字符转换过的,在不断调试中,发现url地址电影名字转码后存在一个"+",心想是不是这个问题,删除"+",链接畅通了,果然是这块问题,对加号进行转义. 关于特殊字符的转义,网

javascript-两个页面对应两个JS,在一个页面进行ajax提交,另一个页面获取

问题描述 两个页面对应两个JS,在一个页面进行ajax提交,另一个页面获取 a.html,a.js b.html,b,js,a页面提交,打开一个窗口,里面显示B页面,同时a页面传递一个参数给B页面,B页面该如何获取这个参数.是使用ajax提交的,地址栏不能穿了.input type=hidden也试过, 解决方案 两个页面之间通过js进行传值一个页面两个窗口 解决方案二: 两个页面之间通过js进行传值 一个页面两个窗口 解决方案三: 两个页面之间通过js进行传值 一个页面两个窗口 解决方案四:

js数组-JS在jsp页面将ajax传递的数组解析成前台数组

问题描述 JS在jsp页面将ajax传递的数组解析成前台数组 通过ajax在后台获取这样的字符串: [['技术评审1','专家2','供应商3','评分4','1'], ['技术评审2','专家2','供应商3','总分4','2'], ['技术评审3','专家2','供应商3','评分4','3']]; 传递到前台,可是默认前台识别的是字符串.怎么将其变成数字呢?达到这样的效果: var datas = [ ['技术评审1','专家2','供应商3','评分4','1'], ['技术评审2',

AJAX XMLHttpRequest对象详解_AJAX相关

AJAX是一种创建交互式网页应用的网页开发技术,是异步Javascript和XML的集合.其核心是XMLHttpRequest对象,可以在不向服务器端提交整个页面的情况下,实现局部更新网页,它是AJAX的Web应用程序架构的一项关键技术. 基本属性: 基本方法: XMLHttpRequest五步法:       第一:创建XMLHttpRequest对象 第二:注册回调函数 第三:设置和服务器交互的参数 第四:设置向服务器端发送的数据,启动和服务器端的交互 第五:判断和服务器端的交互是否完成,还

AJAX(XMLHttpRequest.status)状态码_AJAX相关

下面是Jquery中AJAX参数详细列表: 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址. type String (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET".注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持. timeout Number 设置请求超时时间(毫秒).此设置将覆盖全局设置. async