ajax的简洁封装

我相信大家都用过jquery的ajax,觉得很简练吧,不过我今天也对ajax进行了封装,跟jquery的ajax非常类似。

对ajax的封装如下:
var $= { 
createXmlHttp : function () {
var xmlHttp = null;
try {
xmlHttp = new XMLHttpRequest();
} catch (e) {
try {
xmlHttp = new ActiveXObject('Msxml2.XMLHTTP');
}catch (ee) {
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
}
return xmlHttp;
},
ajax: function(ajaxInfo) {
var xmlObj = $.createXmlHttp();
if (!xmlObj){
alert("很抱歉,你的浏览器暂时不支持Ajax。");
return;
}
var method = ajaxInfo.method.toUpperCase();
var method=ajaxInfo.method;
var data = null;
xmlObj.open(method,ajaxInfo.url, true);
if(method == "POST"){
data = ajaxInfo.data;
xmlObj.setRequestHeader("CONTENT-TYPE", "application/x-www-form-urlencoded");
}
xmlObj.send(data);
xmlObj.onreadystatechange = function () {
if(xmlObj.readyState == 4) {
if(xmlObj.status == 200) {
var type = ajaxInfo.type.toUpperCase();
if(type == "TEXT") {
ajaxInfo.success(xmlObj.responseText);
}else if(type == "XML") {
ajaxInfo.success(xmlObj.responseXML);
}else{
alert("无法识别的返回方式");
}
xmlObj = null;
}
}
};

}
}

使用ajax的Post请求:
$.ajax({
method:"POST",
url:"servlet/AjaxServlet?time="+new Date().getTime(),
data:"username=abc&password=123",
type:"TEXT",
success:function (data) {
var jason = data ;
alert(jason);
}

});

使用ajax的Get请求:
$.ajax({
method:"GET",
url:"servlet/AjaxServlet?username=abc&password=123&time="+new Date().getTime(),
data:null,
type:"TEXT",
success:function (data) {
var jason = data ;
alert(jason);
}

});

为了简单演示ajax的请求,在这里只是在AjaxServlet中作一个简单的验证。
AjaxServlet的代码:
package com.lrh.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class AjaxServlet extends HttpServlet {

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request,response);

}

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String username=request.getParameter("username");
String password=request.getParameter("password");
PrintWriter out=response.getWriter();
if(username.equals("abc")&&password=="123"){
System.out.println("该用户已经存在");
out.print("该用户已被注册!");
}
out.flush();

}

}

AjaxServlet在web.xml中的配置:
 <servlet>
<servlet-name>AjaxServlet</servlet-name>
<servlet-class>com.lrh.servlet.AjaxServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>AjaxServlet</servlet-name>
<url-pattern>/servlet/AjaxServlet</url-pattern>
</servlet-mapping>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值