必填字段验证jquery显示错误消息

我验证了我的表单中的一些字段..但是我有一些问题..如果没有输入字段，它会显示错误消息..如果填写字段仍显示错误消息..必填字段验证jquery显示错误消息

如何摆放？

我的代码

$("#Name").focus(); 
$("#Name").blur(function(){ 
    var name=$('#Name').val(); 
    if(name.length == 0){ 
     $('#Name').after('<div class="red">Name is Required</div>'); 
    } 
    else { 
    return true; 
    } 
}); 

    $("#Address").blur(function(){ 
    var address=$('#Address').val(); 
    if(address.length == 0){ 
     $('#Address').after('<div class="red">Address is Required</div>'); 
     return false; 
    } 
    else { 
    return true; 
    } 
});

谁能帮助我，请?????

来源

2013-07-20 PoliDev

请让小提琴 –

什么样的信息错误的？ –

你应该删除这个labe用户输入后LS一些数据

$("#Name").focus(); 
$("#Name").blur(function(){ 
    var name=$('#Name').val(); 
    if(name.length == 0){ 
     $('#Name').after('<div class="red">Name is Required</div>'); 
    } 
    else { 
     $('#Name').next(".red").remove(); // *** this line have been added *** 
     return true; 
    } 
}); 

    $("#Address").blur(function(){ 
    var address=$('#Address').val(); 
    if(address.length == 0){ 
     $('#Address').after('<div class="red">Address is Required</div>'); 
     return false; 
    } 
    else { 
     $('#Address').next(".red").remove(); // *** this line have been added *** 
     return true; 
    } 
});

的jsfiddle：DEMO

来源

2013-07-20 06:25:16

这段代码有一个bug。每次模糊时都会重复提醒，而不会删除之前的提醒。 –

尝试删除else条件中添加的html。

if(name.length == 0){ 
     $('#Name').after('<div class="red">Name is Required</div>'); 
    } 
    else { 
    $('.red').empty(); //here 
    return true; 
    }

与同为$("#Address")

来源

2013-07-20 06:18:34

试试这个代码（我只是改变了结构，并添加返回false）：

$("#Name").focus() 

$("#Name, #Address").blur(function(){ 
    if($(this).val().length == 0){ 
     $(this).after('<div class="red">This field is required</div>'); 
    } else { 
     $(this).next('.red').remove() 
    } 
});

但我认为最好的办法是将required attribute添加到你的领域是这样的：

<input type="text" name="name" required /> 
<input type="text" name="address" required />

来源

2013-07-20 06:24:06

您的代码可能无法正确使用'$（this）.next（）。remove（）'，这可能会导致字段地址被删除 –

是的，但我更新了我的代码。我把'$（this）.next（'。red'）。remove（）' –

你的代码有错误，它把DIV多达你在空文本模糊的时间。此错误也被我的代码见式删除：

工作演示http://jsfiddle.net/XqXNT/

$(document).ready(function() { 
    $("#Name").focus(); 
    $("#Name").blur(function() { 
     var name = $('#Name').val(); 
     if (name.length == 0) { 
      $('#Name').next('div.red').remove(); 
      $('#Name').after('<div class="red">Name is Required</div>'); 
     } else { 
      $(this).next('div.red').remove(); 
      return true; 
     } 
    }); 

    $("#Address").blur(function() { 
     var address = $('#Address').val(); 
     if (address.length == 0) { 
      $('#Address').next('div.red').remove(); 
      $('#Address').after('<div class="red">Address is Required</div>'); 
      return false; 
     } else { 
      $('#Address').next('div.red').remove(); 
      return true; 
     } 
    }); 

});

它的更好，如果你使用所需的属性，它确实用更少的代码，更好的方式同样的工作。

HTML5

<input type="text" name="name" required /> 
<input type="text" name="address" required />

来源

2013-07-20 06:30:19

必填字段验证jquery显示错误消息

回答

相关问题