$(function(){ //需要檢查為空白的輸入框的id數組 var nullCheckArray = new Array( "username", "password", "tel" ); //需要檢查數群組類型的輸入框的id數組 var numberCheckArray = new Array( "age", "sex", "tel" ); $("#submit").click(function(){ //檢查為空白 checkNull(nullCheckArray); //檢查數字類型 checkNumber(numberCheckArray); //提交資料 userInfoPost(/user/add.do); }); //檢查輸入框是否為空白 function checkNull(idList){ if(idList != null && idList.length > 0){ for(var i = 0;i < idList.length;i++){ var elem = $("#"+idList[i]); var val = elem.val(); if($.trim(val) == ""){ alert(elem.prev().text+"不可為空!"); return false; } } return true; }else{ return false; } } //監聽輸入框輸入類型 function checkNumber(idList){ if(idList != null && idList.length > 0){ for(var i = 0;i < idList.length;i++){ var elem = $("#"+idList[i]); //失去焦時間點事件 elem.blur(function(){ var val = elem.val(); if(!$.isNumeric(val)){ alert(elem.prev.text+"為數字類型"); return false; } }); } return true; }else{ return false; } } //根據id擷取一個input元素的值 function V(id){ return $.trim($("#"+id).val()); } //提交使用者資訊 function userInfoPost(url){ //取值 var username = V("username"); var password = V("password"); var age = V("age"); var sex = V("sex"); var tel = V("tel"); //封裝js對象 var userInfo = { "username" : username, "password" : password, "age" : age, "sex" : sex, "tel" : tel, }; //提交 $.ajax({ type : "post", url : url, data : userInfo, success : function(data){ //接收服務端傳回值 alert(data); //設定文字框不可編輯 $(".user-info input[type=text]").each(function(){ $(this).attr("readonly","readonly"); $(this).attr("disabled","disabled"); }); //顯示一個div $("#div1").css("display","block"); //隱藏一個div $("#div2").css("display","none"); } }); }});