我在同一页面上有三个表单，我想使用 jQuery 分别验证它们

Question

我仍然是jQuery的新手，并尝试在一个页面上为三个单独的表单设置验证。表单非常简单，第一个只是文本输入和提交，后两个只是单个选择元素并提交。我希望禁用每个提交，直到其相应的元素具有内容。

到目前为止，我设法的是禁用所有提交，直到所有元素都有内容。

我需要做的是重写，以便每个表单都具体。

http://codepen.io/drgs100/pen/tJCzv

Answer 1

我不确定你想要什么，让我们弄清楚你想实现如下目标：

$('form').each(function(){
     $(this).submit();
})

更新：

抱歉，我没有看到您的修改，我想出了如下所示的内容，我认为可以通过给您一点提示来更好地编码。

$("input[type=text], select").keyup(function(){
  if($(this).val() != ''){
        $(this).next().attr("disabled", false);
  }else{
    $(this).next().attr("disabled", true);
  }
}).change(function(){
  if($(this).val() != ''){
        $(this).next().attr("disabled", false);
  }else{
    $(this).next().attr("disabled", true);
  }
});

这对你来说更有意义吗？

更新 2：

根据@Jon评论，这里是OP问题的更好功能，因为没有人能够回答为什么不帮助其他人处理相同的情况：

var submits = $("form .submit");
function containBlanks (elem) {
  return $(elem).siblings(".required").val() === "";
}
function requiredFilledIn(elems){
  elems.each(function() {
    if (containBlanks(this)) {
      $(this).attr("disabled", "disabled");
    } else {
      $(this).removeAttr("disabled");
    }
  });
}
requiredFilledIn(submits);
$("form span").hide();
$("input[type=text], select").focus(function(){
        $(this).next().next().fadeIn("slow");
  }).blur(function(){
        $(this).next().next().fadeOut("slow");
  }).keyup(function(){
        requiredFilledIn($(this).siblings("input[type=submit]"));
}).change(function(){
        requiredFilledIn($(this).siblings("input[type=submit]"));
});

@Jon信用