表单验证

最新推荐文章于 2024-03-14 14:27:02 发布

一剑轻语

最新推荐文章于 2024-03-14 14:27:02 发布

阅读量228

点赞数

分类专栏：前端文章标签：表单验证唯一性检验正则

本文链接：https://blog.csdn.net/yijianqingyu/article/details/79386321

版权

前端专栏收录该内容

16 篇文章 0 订阅

订阅专栏

实现：表单验证

1.非空验证

customerName==""||customerName==undefined||customerName==null

2.正则验证

适用于手机、邮箱等规律性文段

var phonereg=/^[1][0-9]{10}$/;
if(phonereg.test(phone)){
bool=false;//最后表单提交时如果为false则不提交
$("#phoneWarn").text("手机号码格式不对");//phoneWarn为手机号码错误提示的id

}

3.长度验证

适用于名字、备注等信息

        if(note.length>=200){
     bool=false;
     $("#noteWarn").text("请输入小于200个字符");

}

4.唯一性验证

有些字段在数据库是唯一性标识的，因此保存和修改前需要判断是否已存在

添加使用ajax验证是否已存在该数据

        if(bool==true){
    $.ajax({
    url:"judgeCustomerName",
    data:{"customerName":customerName},
    dataType:"json",
    success:function(result){
    if(result.data=="ok"){
    $("#addCustomer").submit();
    }
    if(result.data=="error"){
    $("input[name='customerName']").next().children().text("该客户已存在");
    }
    }
    })
    }

修改判断当前数据和原始数据是否一致，一样说明没有改，可以提交，不一样，验证数据库是否有该数据

if(bool==true){

if(originalcustomerName==customerName){

//originalcustomerName为客户名字，customerName为客户输入框中输入的名字

$("#updateCustomer").submit();
}else{
$.ajax({
url:"judgeCustomerName",
data:{"customerName":customerName},
dataType:"json",
success:function(result){
if(result.data=="ok"){
$("#updateCustomer").submit();
}
if(result.data=="error"){
$("input[name='customerName']").next().children().text("该客户已存在");
}
}
})
}