jq封装的ajax，然后 在此前和此后都是很多要考虑的 ，何不 想想构思封装下。
下面：
基本上网页都存在各种ajax，使得网页变得更加易于操作。
举个长长的例子吧：
<input type="button" value="↑" onclick="changeBidSign('netcreditadmin/bidSignDownA.action',${bidlists.bidId},'UP')">
这是一个向上的按钮--js方法，
changeBidSign（action，id，status）；status存在，使得此方法同样可以运用到 Down Left 之类
下面介绍js，整体构思：
admin：是我写 具体复杂的操作的js方法
ajax——common
ajaxfun：写上简单的ajax提交类似：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
/**
* 简单的form表单提交
*/
function simpleSub(formId, callbackFun){
//var DivRef = document.getElementById("Loader");
var options = {
dataType:
'json'
,
// beforeSubmit: function(){
// //提交开始前使按钮不可用
// $("#"+buttonId).attr("disabled", "true");
// DivRef.style.display = "block";
// },
success: callbackFun
//此方法封装在callbackfun.js
};
$(
"#"
+formId).ajaxSubmit(options);
return
false
;
}
|
callbackfun.js： 写在response回调函数
进程的分析如下：
前台ajax交互，无非是data不同，要么前面逻辑处理。 所以 分3部分
1. data 和 逻辑处理 写在同一个js里面。
2. ajax基本共用，
3. 回调函数兴许，有时候 div 等局部刷新。所以这里callbackFun 一个远不够。这里归一类。
data 和 逻辑：
function batchDelete(checkboxName, delTagAction, listTagAction, rel){
var ids=new Array();
if($("input[name="+checkboxName+"]:checked").size()==0){
alertMsg.warn("请至少选择一条需要删除的数据！");
return false;
}
$("input[name="+checkboxName+"]:checked").each(function(i,obj){
ids[i]=$(obj).val();
});
var idStr=ids.join("-");
//alert(idStr);
if (confirm("删除的数据将放入回收站,确定继续")) {
dialogAjaxSimple(delTagAction,idStr);
}else{ return false;
}
}
ajax基本共用：
function dialogAjaxSimple(tagAction,idStr){
$.ajax({
url:tagAction,
data:{
sendTime:(new Date()).getTime(),
idStr:idStr
},
type:"post",
async:false,
dataType:"json",
success:reponse
});
}回调函数兴许，有时候 div 等局部刷新:
//tab页面的ajax回调
function response(data){
if(data.success == true){
alertMsg.correct(data.msg);
var $box = $("#"+data.rel+"");
$box.ajaxUrl({
type:"POST", url:data.url, data: null, callback:function(){
$box.find("[layoutH]").layoutH();
}
});
}else{
alertMsg.error(data.reason);
}
}
在后台，我想说的也有：
两个文件，一个是类，一个是reponse后的页面。
类先说吧：
clientResponse = successResponse("操作成功",
"netcreditadmin/getbidListA.action", "bidId");
这个是我 getset的字符串clientResponse。
···/**
* ajax返回的json对象
* */
protected String failResponse(String reason) {
String response = "{\"success\": false, \"reason\":\"" + reason + "\"}";
return response;
}
protected String successResponse(String msg, String url, String rel) {
String response = "{\"success\": true,\"msg\":\"" + msg
+ "\",\"url\":\"" + url + "\",\"rel\":\"" + rel + "\"}";
return response;
}先看配置文件吧：
<action name="bidSignDownA" class="xidian.sl.netcredit.action.admin.BasicDataA"
method="bidSignDownA_">
<result name="success">/WEB-INF/ajax_response/client.jsp</result>
</action>
ajax_response/client.jsp：
<%@ taglib prefix="s" uri="/struts-tags"%>
<% response.setCharacterEncoding("UTF-8"); %>
<% System.out.println(response);%>
<s:property value="clientResponse" escape="false"/>到这里终于 全部过程讲了一遍。适合学过jq的人。
这封装不单单这一种，但是我想说，这慢慢改 慢慢改都会可以的。java之路皆美也，共同开发。
学jq，js 学java 必须带这脑子学。做这个必须让自己，问自己为什么做这个。
加油！！！
