Question

我现在正在编写一个关于表单验证的教程，我想帮助解释为什么这个函数总是返回if条件。

<html>
<head>
</head>
<body>
     <form id="form" action="#" method="post">
        <fieldset>
            <p>
                First Name:
                <input type="text" id="txt" />
            </p>
            <p> <input type="submit" value="submit" onclick="validate()" /> </p>
        </fieldset>
    </form>
    <script type="text/javascript"> 
        function validate() 
            {
            var userName = document.getElementById("txt").value;
            if (userName.length == 0)
                {
                alert("FINISH THAT UP");
                return false;
                } 
            else 
                {
                alert("thanks, " + UserName);
                }
            }
    </script>
</body>

Answer 1

当文本框不为空时，它会到达else部分，但随后会因错误而崩溃，因此表单会以静默方式提交。

JavaScript区分大小写 - UserName与userName不同，因此未定义。

更改为：

alert("thanks, " + userName);

为避免此类问题，您可以使用try..catch这样包装整个块：

function validate() 
{
    try
    {
        var userName = document.getElementById("txt").value;
        if (userName.length == 0)
        {
            alert("FINISH THAT UP");
            return false;
        } 
        else 
        {
            alert("thanks, " + UserName);
        }
    } catch (err) {
        alert("general error while validating: " + err.message);
        return false;
    }
}

有了这个，你会看到“UserName未定义”。

Live test case

此外，在旁注 - 使用您当前的代码，即使是空值，表单仍然会被提交，尽管您返回false - 这是因为您需要取消提交甚至：

<input type="submit" value="submit" onclick="return validate()" />

您忘记了return本身的onclick关键字。

Answer 2

JavaScript是区分大小写的语言。因此，在else语句中更正userName变量名称，如下所示。

  else {
      alert("thanks, " + userName); 
  }

Answer 3

你能试试吗？我认为这可行。

function validate() 
{
    try
    {
        var userName = document.getElementById("txt").value;
        if (userName)
        {
            alert("FINISH THAT UP");
            return false;
        } 
        else 
        {
            alert("thanks, " + UserName);
        }
    } catch (err) {
        alert("general error while validating: " + err.description);
    }
}

Answer 4

这个怎么样

function validate(){
    $("#form").submit(function() {

    if($("#txt").val()==""){
        alert("FINISH THAT UP");
        return false;
    }
    if($("#txt").val()!=""){
        var un = $("#txt").val();
        alert("thanks, " + un);
        return true;
    }
   });

}

javascript if-else循环没有到达else

4 个答案: