Question

我有一个页面，其中包含4个jQuery选项卡，每个选项卡上包含不同的表单。每个表单都应该采用不能＆gt;的数字。 100。

我写了这个jQuery代码来验证表单，以确保输入的数字是＆lt; 100：

 $(document).ready(function(){ 
    var preventSubmit = 0;
    $('#targetForm').submit(function(){
        $(':input', '#targetForm').each(function(){
            if(this.value > 100){
                $('#message').fadeIn();
                $('#message').fadeOut(4000);
                prevent = 1;

            }//END IF

        });
        if(preventSubmit == 1){
            preventSubmit = 0;
            return false;
        }//END IF
    });
});

它工作正常但只有第一个选项卡上的表单。如果我单击第二个选项卡并提交无效数据（超过100），则不会进行验证。

有什么想法吗？

谢谢

Answer 1

点击每个标签页并且您的AJAX请求已完成修改表单后，请务必通过调用以下内容将.submit()处理程序重新附加到表单：

$('#targetForm').submit(function() {
  $(':input', '#targetForm').each(function() {
    if (this.value > 100) {
      $('#message').fadeIn();
      $('#message').fadeOut(4000);
        prevent = 1;
    }
  });

  if (preventSubmit == 1) {
    preventSubmit = 0;
    return false;
  }
});

假设这是全局Javascript，它只会在页面最初加载时运行一次。当AJAX请求被发送并在同一页面上修改表单时，它不会再次运行。因此，您需要在AJAX请求返回后再次调用此函数，以确保它出现在新修改的表单上。

选项卡页面中的jQuery验证问题

1 个答案: