好用的AJAX类代码分享

2016-02-19 10:06 2 1 收藏

在这个颜值当道,屌丝闪边的时代,拼不过颜值拼内涵,只有知识丰富才能提升一个人的内在气质和修养,所谓人丑就要多学习,今天图老师给大家分享好用的AJAX类代码分享,希望可以对大家能有小小的帮助。

【 tulaoshi.com - Web开发 】

ajax.js
-------------------------[ajax类]--------------------------
代码如下:

function Ajax(recvType){
var aj=new Object();
aj.recvType=recvType ? recvType.toUpperCase() : 'HTML'; //向形参中传递的文件类型
aj.targetUrl='';
aj.sendString='';
aj.resultHandle=null;
/*创建XMLHttpRequest对象*/
aj.createXMLHttpRequest=function(){
var xmlHttp = false;
if(window.XMLHttpRequest){ //在非IE中创建XMLHttpRequest对象
xmlHttp = new XMLHttpRequest();
}else if(window.ActiveXObject){
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); //按新版IE创建
}catch(error1){ //创建失败
try{
xmlHttp = new ActiveXobject("Microsoft.XMLHttp"); //按老版IE创建
}catch(error2){ //创建失败
xmlHttp = false;
}
}
}
return xmlHttp;
}
aj.XMLHttpRequest=aj.createXMLHttpRequest();
/*处理服务器的响应*/
aj.processHandle=function(){
if(aj.XMLHttpRequest.readyState == 4){
if(aj.XMLHttpRequest.status == 200){
if(aj.recvType=="HTML")
aj.resultHandle(aj.XMLHttpRequest.responseText);
else if(aj.recvType=="XML")
aj.resultHandle(aj.XMLHttpRequest.responseXML);
}
}
}
/*定义使用get方法传递的方法*/
aj.get=function(targetUrl, resultHandle){
aj.targetUrl=targetUrl;
if(resultHandle!=null){
aj.XMLHttpRequest.onreadystatechange=aj.processHandle;
aj.resultHandle=resultHandle;
}
if(window.XMLHttpRequest){
aj.XMLHttpRequest.open("get", aj.targetUrl);
aj.XMLHttpRequest.send(null);
}else{
aj.XMLHttpRequest.open("get", aj.targetUrl, true);
aj.XMLHttpRequest.send();
}
}
/*定义使用post方法传递的方法*/
aj.post=function(targetUrl, sendString, resultHandle){
aj.targetUrl=targetUrl;
if(typeof(sendString)=="object"){
var str="";
for(var pro in sendString){
str+=pro+"="+sendString[pro]+"&";
}
aj.sendString=str.substr(0, str.length-1);
}else{
aj.sendString=sendString;
}
if(resultHandle!=null){
aj.XMLHttpRequest.onreadystatechange=aj.processHandle;
aj.resultHandle=resultHandle;
}
aj.XMLHttpRequest.open("post", targetUrl);
aj.XMLHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
aj.XMLHttpRequest.send(aj.sendString);
}
return aj;
}

-------------------------[使用方法]--------------------------
useAjax.html
代码如下:

script src="ajax.js"/script
script language="javascript" type="text/javascript"
var ajax=Ajax();
/*get使用方式*/
ajax.get("server.php?name=zhangsan&phone=778", function(data){
alert(data); //data为从服务器端读取的数据
});
/*第一种post使用方式*/
/* ajax.post("server.php", "name=ligang&phone=222", function(data){
alert(data);
});
*/
/*第二种post使用方式*/
/* ajax.post("server.php", {name:"tom",phone:"456"},function(data){
alert(data);
});
*/
/script
server.php
?php
header("Content-type:text/html;charset=gb2312");
$str = "姓名:{$_GET["name"]}n电话:{$_GET["phone"]}";
echo $str;
?

在浏览器中输入useAjax.html的地址,若出现

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

则Ajax方法使用正确

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

来源:https://www.tulaoshi.com/n/20160219/1593396.html

延伸阅读
标签: Web开发
代码如下: /* 调用方式: 1.POST方式 var txt = escape(sender.value); //document.getElementById("%= txtName.ClientID %").value); var data = "name=" + txt + "&pwd=" + txt; var option = { "url": "handler/Handler.ashx" , "action": "POST" , "callback": function(){ if (xmlHttp.readyState == 4) {//服务器给了回应 if (x...
标签: Web开发
AJAX Suggest 源代码的实例 下面的源代码属于上一节的 AJAX 实例。 您可以拷贝粘贴这些代码,然后亲自测试一下。 AJAX HTML 页面 这是 HTML 页面。它包含了一个简单的 HTML 表单,以及一个指向 JavaScript 的链接。 htmlheadscript src="clienthint.js"/script /headbodyform First Name:input type="text" id="...
标签: Web开发
var names; var Cs, St; var rorw=""; var lrcT; function getname(songname){     if(songname==""){         names=$("name").value;     }else{         names=songname;...
标签: Web开发
采用AJAX技术的时候 通常我们无刷新页面提交数据后 用同样的url去获取数据的时候会发现是以前的数据~那样就给client端带来假象了~~ 采用以下的方法可以取消缓存  htm网页  metahttp-equiv="pragma"content="no-cache"  metahttp-equiv="cache-control"content="no-cache,must-revalidate"  metahttp-equ...
标签: Web开发
程序代码: script type="text/javascript" function Ajax(sUrl,sRecvTyp,sQueryString,oResultFunc) { this.Url = sUrl; this.QueryString = sQueryString; this.XmlHttp = this.createXMLHttpRequest(); if (this.XmlHttp == null) { alert("erro"); return; } var objxml = this.XmlHttp; objxml.onreadystatechange = function (){Ajax.han...

经验教程

187

收藏

44
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部