Question

我花了一个小时来处理这个事情，所以当它发现它只是在错误的地方或某个地方引用时，我会感到沮丧。

我正在制作一个基本的HTML页面来测试基本的验证表单输入。如果我在validateForm（）函数的开头删除返回false，它将按预期工作。但是，如果它在验证循环中（如下所示），则它不起作用并且表单提交。（hello.php只输出你好世界）。

此处的所有诊断警报都按预期运行...包括return-false之前的警报。（当我留空输入时）。

我觉得我错过了一些非常明显的东西，但却无法弄清楚它是什么。

<?php 
echo <<<END
<html>
 <head>
 <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
  <title>Test</title>

   <script type="text/javascript">
$(document).ready(function(){
  $("input").focus(function(){
    $(this).css("background-color","#cccccc");
  });
  $("input").blur(function(){
        $(this).css("background-color","#ffffff");
  });
});

function validateForm() {
    alert("Validating");    
    $("form[name=queryForm]").find(":input[type=text]").each(function() {
        alert("Checking " + $(this).attr('name'));
        if($(this).val()==null || $(this).val()=="") {
            $(this).val('REQUIRED');
            $(this).css("background-color","#ffbbbb");
            alert($(this).attr('name') + ' must not be left blank.');
            return false;
        }
    }); // end of the each function
}
</script>
 </head>
 <body>
<form name="queryForm" action="hello.php" onsubmit="return validateForm();" method="post">
<input type="text" name="First Name"><br>
<input type="text" name="Last Name">
<input type="submit" value="Submit">
</form>
 </body>
</html>
END;
?>

Answer 1

find(":input[type=text]")

应该是

find("input[type=text]")

此外，您可能希望返回在.each

之外设置的变量

function validateForm() {
    var valid = true;
    alert("Validating");    
    $("form[name=queryForm]").find(":input[type=text]").each(function() {
        alert("Checking " + $(this).attr('name'));
        if($(this).val()==null || $(this).val()=="") {
            $(this).val('REQUIRED');
            $(this).css("background-color","#ffbbbb");
            alert($(this).attr('name') + ' must not be left blank.');
            valid = false;
        }
    }); // end of the each function
    //then return that variable
    return valid;
}

Answer 2

在.each（）中使用return不会获得所需的结果。

试试这个：

function validateForm() {
alert("Validating");    
var result = true;
   $("form[name=queryForm]").find(":input[type=text]").each(function() {
    alert("Checking " + $(this).attr('name'));
    if($(this).val()==null || $(this).val()=="") {
        $(this).val('REQUIRED');
        $(this).css("background-color","#ffbbbb");
        alert($(this).attr('name') + ' must not be left blank.');
        result =false;
        return false;   //break the each()
    }
}); // end of the each function
return result;
}

返回false由onsubmit忽略

2 个答案: