jQuery的表单验证(Jquery form validation)

我只是想，如果有人离开使用jquery.But没有显示它的文本字段为空打印错误消息。 这是HTML代码：

 <form id="form1" runat="server">
    <div>
    <table>
     <tr>
    <td>
   <label>Name</label></td>
   <td> <input class="required" type="text" name="name" id="name" /><span>(required)</span></td>
     </tr><tr>
    <td><br/><label>Address</label></td>
    <td><input class="required" type="text" name="address" id="address"/><span>(required)</span></td></tr>
     </table>
    </div>
    </form>

这是jQuery代码。

$(document).ready(function () {
   var requiredFlag = ' * ';
    $('form :input').filter('.required').next('span').text(requiredFlag).end();
    if ($(this).is('.required')) {
       if (this.value == '') {
       var errorMessage = 'This is a required field';
                             };
            $('span></span').text(errorMessage).appendTo($(this));
                             }; 
});

可能是我失去了一些东西。 专家帮忙。 谢谢。

Answer 1:

1. this在代码是指window/document对象不是input元件;
2. 有在代码一些错字=> $('span></span') ;
3. 有没有event handler在你的代码，用于验证inputs
4. 您的标记span元素，也没有必要产生一个新的
5. 您可以使用表单submit用于验证输入事件
6. 的:input选择器已被弃用

试试这个：

var errorMessage = 'This is a required field';
$('form input.required').next().text('*');

$('form').submit(function(){
   var errors = 0;
   $('input.required', this).each(function(){
       if (this.value == '') {
          $(this).next().text(errorMessage);
          errors++;
       }
   })
   if (errors > 0) {
     return false // prevents the default action of the event if there are errors
   }
})

1. submit()
2. next()
3. each()

Answer 2:

我不认为这是一个很好的选择： $('span></span') 使用jQuery 兄弟姐妹选择，并改变与的.text（）或.html（）函数跨度文本http://api.jquery.com/html/

文章来源: Jquery form validation