步骤1:引入jQuery库
<script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script>
步骤2:JS封装
$(function(){ /** * ajax封装 * url 发送请求的地址 * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1} * async 默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。 * 注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。 * type 请求方式("POST" 或 "GET"), 默认为 "GET" * dataType 预期服务器返回的数据类型,常用的如:xml、html、json、text * successfn 成功回调函数 * errorfn 失败回调函数 */ jQuery.ax=function(url, data, async, type, dataType, successfn, errorfn) { async = (async==null || async=="" || typeof(async)=="undefined")? "true" : async; type = (type==null || type=="" || typeof(type)=="undefined")? "post" : type; dataType = (dataType==null || dataType=="" || typeof(dataType)=="undefined")? "json" : dataType; data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data; $.ajax({ type: type, async: async, data: data, url: url, dataType: dataType, success: function(d){ successfn(d); }, error: function(e){ errorfn(e); } }); }; /** * ajax封装 * url 发送请求的地址 * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1} * successfn 成功回调函数 */ jQuery.axs=function(url, data, successfn) { data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data; $.ajax({ type: "post", data: data, url: url, dataType: "json", success: function(d){ successfn(d); } }); }; /** * ajax封装 * url 发送请求的地址 * data 发送到服务器的数据,数组存储,如:{"date": new Date().getTime(), "state": 1} * dataType 预期服务器返回的数据类型,常用的如:xml、html、json、text * successfn 成功回调函数 * errorfn 失败回调函数 */ jQuery.axse=function(url, data, successfn, errorfn) { data = (data==null || data=="" || typeof(data)=="undefined")? {"date": new Date().getTime()} : data; $.ajax({ type: "post", data: data, url: url, dataType: "json", success: function(d){ successfn(d); }, error: function(e){ errorfn(e); } }); }; }); 步骤3:jsp页面js调用 <%@ page language="java" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <base href="<%=basePath%>"> <title>jQuery Ajax封装通用类测试</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <jsp:include page="/view/common/js_taglib.jsp"></jsp:include> <script type="text/javascript"> $(function(){ $.ax( getRootPath()+"/test/ajax.html", null, null, null, null, function(data){ alert(data.code); }, function(){ alert("出错了"); } ); $.axs(getRootPath()+"/test/ajax.html", null, function(data){ alert(data.data); }); $.axse(getRootPath()+"/test/ajax.html", null, function(){ alert("成功了"); }, function(){ alert("出错了"); }); }); </script> </head> <body> </body> </html>
相关推荐
对常用jquery的ajax函数进行封装,便于调用,会有不同错误的错误提醒
本文大概分为三步实现jquery ajax通过js封装,通过代码实例讲解,代码附有注释,比较容易理解,具体详情如下所示: 第一步:引入jQuery库 [removed]/resources/js/jquery.min....jQuery Ajax封装通用类 (linjq) *****
改资源为web项目代码实例,导入myeclipse中就可使用。项目中包含各种jquery、json等的包
其中包含6款Ajax分页Demo,文字分页、图片分页都可以。具有一定特效、很炫。基本已经满足各种web分页开发了。
主要介绍了jQuery Ajax 全局调用封装实例代码详解的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
jquery ajax方法的再封装
主要介绍了jquery Ajax 全局调用封装实例详解的相关资料,需要的朋友可以参考下
easy-ajax是为了治理前端乱写Ajax方法而生。接下来通过本文给大家介绍JQuery 封装 Ajax 常用方法,需要的朋友参考下
主要为大家详细介绍了jQuery版AJAX简易封装代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
NULL 博文链接:https://feiyezi.iteye.com/blog/1068948
struts2下通过jquery的ajax从后台传json对象并展示在web页面上的一个小例子,所需的jar包请自己下载否则无法运行,所需的包包括struts的必须包,json的支持包和struts对json的支持包
下面是在项目中封装了jQuery的Ajax,分享给大家。 代码: 代码如下: // ajax 请求参数 var ajaxSettings = function(opt) { var url = opt.url; var href = location.href; // 判断是否跨域请求 var ...
JqueryAjax 无刷新分页 带数据库 直接可运行 pageTest.asp js封装 简化代码
用Jquery里面封装的Ajax方法实现无页面刷新效果 亲绝对有一定技术含量 秒杀Ajax 效果 一定要下载噢 思密达
Ajax表单提交,用 jquery.form.js SDK 封装好的ajaxSubmit
ajax封装数据原理详解,要求为Object或String类型的参数,发送到服务器的数据。如果已经不是字符串,将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换,可以查看 processData选项。对象必须为key/...
jQueryajax封装函数
体现以下jquery的强大,让你的工程使用起来更方便