Question

我试图在其他问题中找到答案，但实际上没有任何效果 - .-不知怎的，我讨厌JavaScript ......无论如何！我的代码看起来像：

function validate()
{
 if ($(":input").length == 0) 
 {
  $(":input").addClass("notvalid");
  return false;
 }
 else
 {
  $(":input").removeClass("notvalid");
  return true;
 } 

 return true;
}

$(":input").blur(validate());
$(":input").keyup(validate());

$("#customForm").submit(function(){
 if(validate()){
  return true;
 }
 else
 {
  return false;
 }
});

我只是想测试每个标签都不是空的。应在焦点丢失或每个键类型之后进行测试。当然，点击提交按钮后。

它不起作用。 Firefox错误控制台说的是：unknown pseudoclass或pseudoelement'input'。这是什么意思？

Answer 1

如果您更熟悉PHP等服务器端脚本，则可以使用AJAX来验证字段。

回到JS这里我认为你想要完成的事情：

$("input:text").bind("blur, keyup", function(){
  if($(this).val().length > 0){
    //Valid not empty
    $(this).removeClass("notvalid");     
  }else{
    //invalid empty
    $(this).addClass("notvalid");
  }
});

$("#customForm").submit(function(){
  $("input:text").keyup(); //triggers the keyup event on input fields 
                         //which then validates your fields according the
                         //code above.

  if($("form .notvalid").length > 0){
    //You got some invalid fields in form

    return false;
  }else{
    //All fields are valid continue

    return true;
  }

}）;

它可能看起来与你的方法完全不同，但如果你想学习jQuery，最好熟悉它。我评论了一些过程，但是如果你对上面代码中使用的方法或函数有任何疑问，你只需谷歌吧。祝你好运！

Answer 2

错误说jQuery不知道用:input选择哪些元素。只需在选择器中替换:input但input:text。您还可以查看jquery.validate插件，它将简化您的验证逻辑。有许多demos on the site可以帮助您入门。

更新：

我的错误。根据文档，有:input选择器。

Answer 3

而不是：

function validate()
{
 if ($(":input").length == 0) 
 {
  $(":input").addClass("notvalid");
  return false;
 }
 else
 {
  $(":input").removeClass("notvalid");
  return true;
 } 

 return true;
}

使用：

function validate()
{

$(":input").each(function(){
  if ($(this).val() === '')
  {
    $(this).addClass("notvalid");
    return false;
  }
  else
  {
    $(this).removeClass("notvalid");
    return true;
  } 
});

 return true;
}

Answer 4

如果你已经使用jQuery，你应该真正使用像Darin所说的jquery.validate插件。

这将使您的代码更清晰，更容易添加标准验证规则，如有效的电子邮件，URL，最小长度，最大长度等。此外，无需为您添加和删除类。

如何使用jQuery验证表单？

4 个答案: