前端之家收集整理的这篇文章主要介绍了
Ajax Jquery 提交验证页面数据,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
$(function(){
var nullCheckArray = new Array(
"username","password","tel"
);
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;
}
}
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");
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");
});
$("#div1").css("display","block");
$("#div2").css("display","none");
}
});
}
});