几种ajax的使用
1.Jquery中使用ajax方法
$.ajax({
type: "get",//(默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。
url: "http://localhost/xxsb/demo/all_sjdctemp.jsp",
timeout : 3000 ,//设置请求超时时间(毫秒)。此设置将覆盖全局设置。
dataType : 'text',//
beforeSend: function(XMLHttpRequest){
//发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头
},
success: function(data, textStatus){
alert(data);
//请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态
},
complete: function(XMLHttpRequest, textStatus){
//请求完成后回调函数 (请求成功或失败时均调用)。
},
error: function(){
alert('调用错误');
//请求出错处理
//(默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。
}
});
2.基本的实现方法
var xmlHttp = false;
//如果使用较新版本的 Internet Explorer,则需要使用对象 Msxml2.XMLHTTP,而较老版本的 Internet //Explorer 则使用 Microsoft.XMLHTTP。非IE则需要XMLHttpRequest。
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
try{
xmlHttp = new XMLHttpRequest();
catch(e3){
alert("您的浏览器不支持AJAX技术");
}
}
}
function send(){
var url = "/demo.action"
//注意下写的顺序,有时候顺序写错了会出错
xmlHttp.open("GET", url, true); //open函数说明见下方
xmlHttp.onreadystatechange = callback; //调用回调函数对服务器进行响应
xmlHttp.send(null); //一般的内容用url发送信息即可,特殊需求可用send发送信息,这是url发送 //信息的写法
}
//回调函数 取得服务器回传的信息
function callback{
if(xmlHttp.readystatechange
if (xmlHttp.readyState == 4) { //详见HTTP就绪状态
if (request.status == 200){ //详见HTTP状态代码
var response = xmlHttp.responseText;
}
}
}
open()参数
request-type:发送请求的类型。典型的值是 GET 或 POST,但也可以发送 HEAD 请求。
url:要连接的 URL。
asynch:如果希望使用异步连接则为 true,否则为 false。该参数是可选的,默认为 true。
username:如果需要身份验证,则可以在此指定用户名。该可选参数没有默认值。
password:如果需要身份验证,则可以在此指定口令。该可选参数没有默认值。
通常使用其中的前三个参数
HTTP就绪状态
HTTP 就绪状态表示请求的状态或情形。它用于确定该请求是否已经开始、是否得到了响应或者请求/响应模型是否已经完成。它还可以帮助确定读取服务器提供的响应文本或数据是否安全。在 Ajax 应用程序中需要了解五种就绪状态:
0:请求没有发出(在调用 open() 之前)。
1:请求已经建立但还没有发出(调用 send() 之前)。
2:请求已经发出正在处理之中(这里通常可以从响应得到内容头部)。
3:请求已经处理,响应中通常有部分数据可用,但是服务器还没有完成响应。
4:响应已完成,可以访问服务器响应并使用它。
与大多数跨浏览器问题一样,这些就绪状态的使用也不尽一致。您也许期望任务就绪状态从 0 到 1、2、3 再到 4,但实际上很少是这种情况。一些浏览器从不报告 0 或 1 而直接从 2 开始,然后是 3 和 4。其他浏览器则报告所有的状态。还有一些则多次报告就绪状态 1。在上一节中看到,服务器多次调用 updatePage(),每次调用都会弹出警告框 —— 可能和预期的不同!
HTTP状态代码
404 该页面不存在
403 和 401 所访问数据受到保护或者禁止访问
200 一切顺利
3.prototype实现ajax
<script type="text/javascript" src="prototype.js"/>
function demo(){
var url="demo.action"; //请求路径
var pars="";//请求参数 如完整请求路径为http://www.demo.com/demo&d1=2,
//则url="http://www.demo.com/demo,pars="d1=2"
var ajax=new Ajax.Request(url,{method:"post",parameters:pars,onComplete:callback});
//callback为回调方法
//var ajax=new Ajax.Updater(div,url,{method:"post",parameters:pars,evalScripts:true});
//evaldemo=function(){}
//使用 Ajax.Request 类还有一些其它的属性可以在这个对象里面定义和设置,如 asynchronous,可以为 true或 false 来决定 AJAX 对服务 器的调用是否是异步的(默认值是 true)。
//还有另外两个有用的选项用来处理结果。我们可以在 onSuccess 选项处传入一个方法,当 AJAX 无误的执行完后调 ,相反的,也可以在 onFailure 选项处传入一个方法,当服务器端出现错误时调用。
}
function callback(request){ //回调方法需有一个参数
var s=request.responseText; //得到服务器返回信息
}
4.dojo实现ajax
<script type="text/javascript" src="dojo.js"/>
function demo() {
var pars={actionSign:'firstlogin',userid:dojo.byId('userid').value}; //请求参数 格式为 {参数名:值}
dojo.xhrPost({ //使用post请求 对应get请求的方法为xhrGet
url:"demo.action",
content:pars,
preventCatch:true, //不使用浏览器缓存 如果使用的话,两个一样的请求,浏览器会从缓存中调用上次请求的结果
handleAs:'text', //返回的数据格式
load:function(data){ //成功请求后的动作
callback(data);
},
error:function(response,ioArgs){ //请求错误后的动作
alert("HTTP status code: " + ioArgs.xhr.status);
}
});
}