手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >自己实现ajax封装示例分享
自己实现ajax封装示例分享
摘要:复制代码代码如下://javascriptObject:ajaxObject//CreatedByRexLeefunctionAjax(ur...

复制代码 代码如下:

//javascript Object: ajax Object

//Created By RexLee

function Ajax(url,data){

this.url=url;

this.data=data;

this.browser=(function(){

if(navigator.userAgent.indexOf("MSIE")>0) {

return "MSIE";//IE浏览器

}else{

return "other";//其他

}})();

};

Ajax.prototype={

get:function(){

var result;

var xmlhttp;

if(this.browser=='MSIE'){

try{

xmlhttp=new ActiveXObject('microsoft.xmlhttp');

}catch(e){

xmlhttp=new ActiveXObject('msxml2.xmlhttp');

}

}else{

xmlhttp=new XMLHttpRequest();

};

xmlhttp.onreadystatechange=function(){

result = xmlhttp.responseText;//闭包,不能采用this.属性

};

xmlhttp.open('GET',this.url+'?'+this.data,false);//true无法抓取数据,why?

xmlhttp.send(null);

return result;

},

post:function(){

var result;

var xmlhttp;

if(this.browser=='MSIE'){

xmlhttp=new ActiveXObject('microsoft.xmlhttp');

}else{

xmlhttp=new XMLHttpRequest();

};

xmlhttp.onreadystatechange=function(){

result = xmlhttp.responseText;//闭包,不能采用this.属性

};

xmlhttp.open('POST',this.url,false);//需设为false,否则无法抓取responseText

xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//POST中,这句必须

xmlhttp.send(this.data);

return result;

}

};

//var a=new ajax('opp2.js','');

//alert('by GETn'+a.get())

//alert('by POSTn'+a.post());

///////////////////////////////

window.onload=function(){

document.getElementById("btn").onclick=function(){

var p=document.getElementById("t").value;

var a=new Ajax("phpOOP/getPage.php","page="+p);

document.getElementById("box").innerHTML=a.get();

};

}

【自己实现ajax封装示例分享】相关文章:

Javascript实现div的toggle效果实例分析

jQuery结合ajax实现动态加载文本内容

JS实现简洁、全兼容的拖动层实例

JavaScript实现广告的关闭与显示效果实例

js实现简单锁屏功能实例

自己编写的支持Ajax验证的JS表单验证插件

nodejs调试cmd命令实现复制目录

jQuery+ajax实现无刷新级联菜单示例

js实现简单div拖拽功能实例

jQuery封装的tab选项卡插件分享

精品推荐
分类导航