Question

我的javascript代码如下：

<script>
    function check(){
        if(document.getElementById("1").value=="") {
            alert("enter 1st value");
            document.getElementById("1").focus();
            return;
        }
        else if(document.getElementById("2").value=="") {
            alert("enter 2nd value");
            document.getElementById("2").focus();
            return;
        }
        return(true);
    }
</script>

我的html页面是

<form action="home.php" method="get">
    <input type="text" id="1"></input>
    <input type="text" id="2"></input>
    <input type="text" id="3"></input>
    <input type="submit"onclick="check()"></input>
</form>

当我故意将输入字段留空时，它正在聚焦，但会立即重定向到home.php页面而不再继续输入值。

Answer 1

您在检查功能中返回void。如果您返回错误提交表单暂停。

<script>
    function check(){
        if(document.getElementById("1").value==""){
            alert("enter 1st value");
            document.getElementById("1").focus();
            return false; // <<<< CHECK THIS LINE;
        }
        else if(document.getElementById("2").value==""){
            alert("enter 2nd value");
            document.getElementById("2").focus();
            return false; // <<<< CHECK THIS LINE
        }
        return(true);
    }
</script>

//编辑输入元素是所谓的自闭标签。正确的语法是：

<input type="text" name="some_name" value="" />

提交按钮应定义为：

<button type="submit">Button text</button>

Answer 2

您需要更改下面的问题

function check(){
     if(document.getElementById("1").value==""){
        alert("enter 1st value");
        document.getElementById("1").focus();
        return false;
     }
     else if(document.getElementById("2").value==""){
        alert("enter 2nd value");
        document.getElementById("2").focus();
        return false;
     }
return(true);
}

如果您的函数返回false，则会阻止表单发布。所以在if条件中返回false。

Answer 3

<html>
    <head>
        <script>
            function check(){
                if(document.getElementById("1").value==""){
                    alert("enter 1st value");
                    document.getElementById("1").focus();
                    return false;
                }
                else if(document.getElementById("2").value==""){
                    alert("enter 2nd value");
                    document.getElementById("2").focus();
                    return false;
                }
                return true;
            }
       </script>
  </head>
  <body>
      <form action="test.html" method="get">
          <input type="text" id="1"></input>
          <input type="text" id="2"></input>
          <input type="text" id="3"></input>
          <input type="submit"onclick="return check()"></input>
      </form>
  </body>
</html>

Answer 4

您需要return false才能取消提交。

<form action="home.php" method="get">
    <input type="text" id="1"></input>
    <input type="text" id="2"></input>
    <input type="text" id="3"></input>
    <input type="submit"onclick="return check()"></input> <!--Notice the return here-->
</form>

function check()
{
    if(document.getElementById("1").value=="")
    {
        alert("enter 1st value");
        document.getElementById("1").focus();
        return false;//return false instead of void
    }
    else if(document.getElementById("2").value=="")
    {
        alert("enter 2nd value");
        document.getElementById("2").focus();
        return false;//return false instead of void
    }
    return true;
}

JSFiddle

Answer 5

你没有检查第三个字段是否为空....如果它是空的，它将如何停止？

不需要经过测试

还需要使用return false以防止页面继续运行，因为它会告诉浏览器重置此类操作。

然后使用return check()代替改为

  <html>
    <script type="text/javascript">

        function check(){
            if(document.getElementById("1").value==""){
                alert("enter 1st value");
                document.getElementById("1").focus();
                return false;
            }
            else if(document.getElementById("2").value==""){
                alert("enter 2nd value");
                document.getElementById("2").focus();
                return false; 
            }
            else if(document.getElementById("3").value==""){
                 alert("enter 3nd value");
                document.getElementById("3").focus();
                return false; 
            }
            return(true);
        }

    </script>
    <form action="home.php" method="get">
    <input type="text" id="1"></input>
    <input type="text" id="2"></input>
    <input type="text" id="3"></input>
    <input type="submit"onclick="return check()"></input>
    </form>

Answer 6

<form action="home.php" method="get" onSubmit="return check();">
<input type="text" id="1"></input>
<input type="text" id="2"></input>
<input type="text" id="3"></input>
<input type="submit"></input>
</form>

为什么页面在没有完成表单的情况下重定向到action in action属性？

6 个答案: