初學AJAX非同步提交擷取JSON類型資料

當遇到校正資料庫中是否存在已有記錄這種需求時，需要先用AJAX提交後台ACTION 判斷是否資料庫中存在記錄，通過返回JSON型資料，在前台接收，輸出結果:比如拿登入使用者舉例:<%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>首先定義好全域路徑form表單中的登入按鈕type="button" 手動進行提交， 加上onclick事件onclick="login.submit();"在使用者名稱框附近可以寫上錯誤塊,定義一個message屬性來傳遞錯誤資訊:<div id="errmsg" class="errorBox" style='display:none;'><span id="err_id"></span><s:property value="getText(message)" escape="false" /></div>(表單中是不需要寫action和onsubmit()的)關聯login和login_Funcvar login = new login_Func();在JS中定義好loginFunc這個方法var login_Func=function(){}login_Func.prototype.submit=function(){此處可以加上使用者名稱 密碼是否為空白的校正如var usernameVar = document.getElementById('username').value;或 =$('#username').val();可以參照:if( $('#username').val() == '' ){$('#errmsg').css({'display':''});$('#err_id').html('<s:property value="getText('login.userName.null')" />');return false;}else if($('#password').val() == '' ){$('#errmsg').css({'display':''});$('#err_id').html('<s:property value="getText('login.passWord.null')" />');return false;}假設JSON出參有兩個KEY 那麼就先設兩個變數來接這兩個KEY,一個成功，一個失敗var submitFlag = null;var errorFlag = null;需要把介面的使用者名稱和密碼封裝成JSON參數，採用POST方式傳遞值var userParam = {"user.username":$("#username").val(),"user.password":$("#password").val()};其中user.username表示後台可以通過user.getUsername()的方式來擷取其值，如果參數為username的話，則背景user則為null....如果想alert userParam的資料方法，可以看上一篇文章  。定義ajax$.ajax({url:'validate.shtml',//先走校正的actioncache:false,//拒絕緩衝async:false,//非同步提交type:'post',data:userParam,dataType:'json',success:function(data){submitFlag = data.SUBMIT_FLAG;//如果採用此種方式獲得背景SUBMIT_FLAG, GOOGLE瀏覽器沒問題， Firefox沒問題，IE6是有問題的，他不認的SUBMIT_FLAG是什麼errorMessage = data.ERROR_MESSAGE;//所以採用下面的方法獲得json資料//retdata儲存value//pro儲存keyvar retdata = eval("("+data+")");for (var pro in retdata) {if(pro=="SUBMIT_FLAG"){alert(retdata[pro]);}else if(pro=="FAILURE_FLAG"){alert(retdata[pro]);return;}/*if(retdata[pro]=="SUBMIT_FLAG"){alert("儲存成功!");}else if(retdata[pro]=="FAILURE_FLAG"){alert("角色名稱已存在!");}*/}//或者用這種方式 顯示更友好if(pro=="SUBMIT_FLAG"){提交操作，見下}else if(失敗的key){$('#errmsg').css({'display':''});$("#err_id").html("");if(pro==失敗的key){$("#err_id").append("使用者不存在");}else if(pro==失敗的key){$("#err_id").append("密碼錯誤");}}    } });if ('undefined' != submitFlag && null != submitFlag && 'true' == submitFlag) {document.getElementById("loginForm").action='<%=basePath%>'+"login.shtml";//成功則提交login document.getElementById("loginForm").submit();} else {}}後台:HttpServletResponse response = ServletActionContext.getResponse();response.setContentType("text/html;charset=utf-8");response.setHeader("Pragma","No-cache");response.setHeader("Cache-Control","no-cache");response.setHeader("Cache-Control", "no-store");PrintWriter writer = response.getWriter();JSONObject json = new JSONObject();校正操作 成功json.put("SUBMIT_FLAG","儲存成功!");失敗 json.put("FAILURE_FLAG", "使用者名稱已存在!");writer.write(json.toString());    writer.flush();    writer.close();struts2中 返回json類型: <result type="json">