如何用ajax来创建一个XMLHttpRequest对象


Posted in Javascript onDecember 10, 2012

我每次创建一个对象,都要这样复杂吗?如下代码:
JScript code:
"testAjax.htm" 文件:

<html> 
<body> 

<script type="text/javascript"> 

function ajaxFunction() 

{ 

var xmlHttp; 

try 

{ 

// Firefox,Opera 8.0+,Safari 

xmlHttp=new XMLHttpRequest(); 

} 

catch (e) 

{ 

// Internet Explorer 

try 

{ 

xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 

} 

catch (e) 

{ 

try 

{ 

xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 

} 

catch (e) 

{ 

alert("您的浏览器不支持AJAX!"); 

return false; 

} 

} 

} 

} 

</script> 

<form name="myForm"> 

用户: <input type="text" name="username" /> 

时间: <input type="text" name="time" /> 

</form></body> 

</html>

首先声明一个保存 XMLHttpRequest 对象的 xmlHttp 变量。
然后使用 XMLHttp=new XMLHttpRequest() 来创建此对象。这条语句针对 Firefox、Opera 以及 Safari 浏览器。假如失败,则尝试针对 Internet Explorer 6.0+ 的 xmlHttp=new ActiveXObject(“Msxml2.XMLHTTP”),假如也不成功,则尝试针对 Internet Explorer 5.5+ 的 xmlHttp=new ActiveXObject(“Microsoft.XMLHTTP”)。

假如这三种方法都不起作用,那么这个用户所使用的浏览器已经太过时了,他或她会看到一个声明此浏览器不支持 AJAX 的提示。

可以不用这么麻烦,直接可以把这个函数的定义单独保存为一个js文件,在需要使用AJAX的页面中引用这个文件就可以了。
如下面详解的例子:
JScript code:

function CreateHTTPObject() 
{ 
var xmlhttp; 
try 
{ 
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
} 
catch (e) 
{ 
try 
{ 
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
catch (e) 
{ 
xmlhttp = false; 
} 
} 
if (!xmlhttp && typeof XMLHttpRequest!='undefined') 
{ 
try 
{ 
xmlhttp = new XMLHttpRequest(); 
} 
catch (e) 
{ 
xmlhttp=false; 
} 
} 
if (!xmlhttp && window.createRequest) 
{ 
try 
{ 
xmlhttp = window.createRequest(); 
} 
catch (e) 
{ 
xmlhttp=false; 
} 
} 
return xmlhttp;

}定义上面的函数,调用时创建实例即可,如下:
JScript code:
var xmlHttp = CreateHTTPObject(); 
if (!xmlHttp) 
{ 
return; //无法创建 xmlhttp 对象 
} 
xmlHttp.open("GET", url, true); 
xmlHttp.onreadystatechange = function(){HandleRequest(xmlHttp, "元素ID")}; 
xmlHttp.send(null);

也可以直接用jquery ,一句话搞定,如下代码:
$(document).ready(function(){ 
$("#userpass").blur(function(){ 
var password=$("#userpass").val(); 
var name=$("#username").val(); 
if(password==""||password==null){ 
$("#pass").html("<font color='red'>请输入密码! </font>"); 
b=false; 
}else if(!/^[a-zA-Z0-9_]{6,16}$/.test(password)){ 
$("#pass").html("<font color='red'>输入格式不正确!密码应至少6为数字或字符 </font>"); 
b=false; 
}else{ 
$.get("LoginAjaxPassword",{"userpass":encodeURI(encodeURI(password)),"username":encodeURI(encodeURI(name))},function(response){ 
$("#pass").html(response); 
if(response=="<font color='green' size='2' >"+"√"+"</font>"){ 
b=true; 
} 
}); 
} 
return b; 
}); 
$("#login-submit").click(function(){ 
var autologin=document.getElementById("autologin").checked; 
if(a&&b){ 
//if($("#autologin").attr("checked")==true){ 
if(autologin==true){ 
//${"#login-user-form"}.attr("action","AutoLogin"); 
//$("#login-user-form").submit(); 
document.form.action="AutoLogin"; 
document.form.submit(); 
}else{ 
//${"#login-user-form"}.attr("action","Login"); 
//$("#login-user-form").submit(); 
document.form.action="Login"; 
document.form.submit(); 
} 
} else{} 
}); 
}); 
</script>
Javascript 相关文章推荐
document.documentElement &amp;&amp; document.documentElement.scrollTop
Dec 01 Javascript
js Function类型
Dec 04 Javascript
JS 精确统计网站访问量的实例代码
Jul 05 Javascript
JS中使用sort结合localeCompare实现中文排序实例
Jul 23 Javascript
javascript实现在网页任意处点左键弹出隐藏菜单的方法
May 13 Javascript
jQuery插件passwordStrength密码强度指标详解
Jun 24 Javascript
浅谈EasyUi ComBotree树修改 父节点选择的问题
Nov 07 Javascript
jQuery插件版本冲突的处理方法分析
Jan 16 Javascript
详解如何使用vue-cli脚手架搭建Vue.js项目
May 19 Javascript
angularjs $http实现form表单提交示例
Jun 09 Javascript
3分钟了解vue数据劫持的原理实现
May 01 Javascript
详解一些适用于Node.js的命名约定
Dec 08 Javascript
iframe 上下滚动条如何默认在下方实现原理
Dec 10 #Javascript
Ajax执行顺序流程及回调问题分析
Dec 10 #Javascript
js切换div css注意的细节
Dec 10 #Javascript
不同的jQuery API来处理不同的浏览器事件
Dec 09 #Javascript
addEventListener和attachEvent二者绑定的执行函数中的this不相同
Dec 09 #Javascript
Javascript获取窗口(容器)的大小及位置参数列举及简要说明
Dec 09 #Javascript
定义JavaScript二维数组采用定义数组的数组来实现
Dec 09 #Javascript
You might like
phpMyAdmin 安装及问题总结
2009/05/28 PHP
解析linux下安装memcacheq(mcq)全过程笔记
2013/06/27 PHP
php实现购物车功能(以大苹果购物网为例)
2017/03/09 PHP
PHP编程实现微信企业向用户付款的方法示例
2017/07/26 PHP
JSON PHP中,Json字符串反序列化成对象/数组的方法
2018/05/31 PHP
jQuery Validation插件remote验证方式的Bug解决
2010/07/01 Javascript
JavaScript显示当前文档最后修改日期的方法
2015/03/19 Javascript
JavaScript汉诺塔问题解决方法
2015/04/21 Javascript
jquery ajaxfileupload异步上传插件使用详解
2017/02/08 Javascript
详解从Node.js的child_process模块来学习父子进程之间的通信
2017/03/27 Javascript
微信分享调用jssdk实例
2017/06/08 Javascript
JavaScript实现的搜索及高亮显示功能示例
2017/08/14 Javascript
详解使用React制作一个模态框
2019/03/14 Javascript
js继承的这6种方式!(上)
2019/04/23 Javascript
react实现antd线上主题动态切换功能
2019/08/12 Javascript
jQuery实现鼠标移入显示蒙版效果
2020/01/11 jQuery
详解python3百度指数抓取实例
2016/12/12 Python
Python输出由1,2,3,4组成的互不相同且无重复的三位数
2018/02/01 Python
Python中str.join()简单用法示例
2018/03/20 Python
pandas使用get_dummies进行one-hot编码的方法
2018/07/10 Python
tensorflow实现简单逻辑回归
2018/09/07 Python
tensorflow实现逻辑回归模型
2018/09/08 Python
python中time tzset()函数实例用法
2021/02/18 Python
CSS3实现div从下往上滑入滑出效果示例
2020/04/28 HTML / CSS
西班牙床垫网上商店:Colchones.es
2018/05/06 全球购物
WiFi云数码相框:Nixplay
2018/07/05 全球购物
Lucene推荐的分页方式是什么?
2015/12/07 面试题
完美实现CSS垂直居中的11种方法
2021/03/27 HTML / CSS
施工安全协议书
2013/12/11 职场文书
医药销售自我评价200字
2014/09/11 职场文书
群众路线教育实践活动思想汇报(2014特荐篇)
2014/09/16 职场文书
英语邀请函范文
2015/02/02 职场文书
2015年师德表现自我评价
2015/03/05 职场文书
2015年农村党员公开承诺事项
2015/04/28 职场文书
Python破解极验滑动验证码详细步骤
2021/05/21 Python
Android 中的类文件和类加载器详情
2022/06/05 Java/Android