我相信大家都用过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>
分享到:
相关推荐
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯;2,可以对ajax操作做一些统一处理,比如追加随机数或其它参数。同时在...
本函数封装了js的ajax,php为处理后台数据,仅支持post,代码很简洁
该案列使用jsp+servlet+ajax实现登录,页面简洁大方,弹框都是封装的插件,整体案列采用三层的模式,链接数据库方面用的是dbcp的链接池,数据库时mysql,
以下是封装的一个处理函数,使用是也十分方便: 文件的名字命名为: jQuery.ajaxRequest.js . 使用方法: 代码如下:$(‘._ajax’).click(function(){ _ajax.request(this); return false; }); var _ajax = { ...
jquery是一个优秀的js框架,自然对js原生的ajax进行了封装,封装后的ajax的操作方法更简洁,功能更强大,与ajax操作相关的jquery方法有如下几种,但开发中经常使用的有三种: 1)$.get(url, [data], [callback], ...
request-funjs 快速上手 安装 npm install request-funjs ... import Request from 'request-funjs' ; Vue . prototype ....//在这里需要声明一个 host 变量,作为请求的主机名称 Request .... import Request from 'request-...
后台管理系统源码 CYQData 数据框架:是一款操作数据库用的数据框架:简洁易用、功能强大、性能优越、内置支持多数据库、多语言...个人精装封装的基类、GET方式的分页控件、通过的工具栏、简装的Ajax封装、验证脚本等。
jQuery API文档。jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的...它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。
这是一个页面简洁的商品管理系统以struts为主要的页面跳转是一个页面简洁代码清晰安全性高的管理系统 ,用spring框架来进行处理事务的。代码对jdbc进行了轻量级的封装从而把代码更加完美。达到了指定的效果。
HyAdmin简洁、流畅、安全、自适应移动设备的后台管理框架(基于ThinkPHP,原名HyFrame)Document: DEMO: (ACCOUNT:123/PASSWORD:123123)Overview框架基于ThinkPHP和Metronic二次封装,集成了众多现代特性(移动...
业务层封装业务流程,为适应业务的变更,每一业务模块均有专门的接口及实现类,代码简洁且可适应不同的数据库。该系统严格按照软件开发流程:需求分析、页面设计、概要设计、详细设计、测试运行等
内容索引:脚本资源,jQuery,Tab,选项卡,滑动门 本Javascript UI库是基于jQuery的扩展,完成jQuery Tab功能,已封装成库,使用非常方便,内含动画版的选项卡及滑动门,当前很流行的网页设计模式,风格越简洁,当然你...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 1.什么是jQuery 认识jQuery 1.什么是jQuery 认识jQuery 什么是jQuery jQuery的特点: ...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...
它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。 jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的...