Question

我想检查文本框是否包含名称。如果没有，则在按下提交按钮后应弹出警告，显示消息，并且页面不应提交空白值。如果它包含值，则应提交该值。

我正在使用以下代码。当我将文本框留空并单击提交按钮时，它会按预期显示警报，但在解除警报后也会提交空值。

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

            function check()
            {
                if (!frm1.FileName.value)
                {
                    alert ("Please Enter a File Name");
                    return (false);
                }
                return (true);
            }

        </script>
    </head>
    <body>
        <form name="frm1" id="frm1" action="/cgi-bin/page.pl" method="POST">
            <input type="text" name="FileName" id="FileName">       
            <input type="submit" value="send" name="btn_move" id="btn_move" onclick="check()">
        </form>
    </body>
</html>

代码中有什么问题？

Answer 1

您需要onclick="return check();"

Answer 2

试试这个

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

            function check()
            {
                if (document.getElementById('FileName').value==""
                 || document.getElementById('FileName').value==undefined)
                {
                    alert ("Please Enter a File Name");
                    return false;
                }
                return true;
            }

        </script>
    </head>
    <body>
        <form name="frm1" id="frm1" action="/cgi-bin/page.pl" method="POST">
            <input type="text" name="FileName" id="FileName">       
            <input type="submit" value="send" name="btn_move" id="btn_move" onclick="return check();">
        </form>
    </body>
</html>

Answer 3

您从false返回check，但不从事件处理程序返回值。

仅当事件处理程序返回false时，才会阻止默认操作（在这种情况下提交表单）：

onclick="return check();"

查看优秀的introduction to event handlers at quirksmode.org，了解有关事件处理的基础知识（并了解比内联事件处理程序更好的方法）。

一般来说，最好不要在按下提交按钮时，而是在提交表单之前执行这些检查。因此，不是将处理程序绑定到按钮上的单击事件，而是将其绑定到表单的 submit 事件，例如（使用传统的事件处理程序）：

document.getElementById('frm1').onsubmit = function() {
    if (!this.FileName.value) {
        alert ("Please Enter a File Name");
        return false;
    }
};

优势在于，不仅在单击提交按钮时（例如，如果通过按Enter键“执行”提交按钮），将对所有表单提交进行检查。

如何检查文本框是否为空？

3 个答案: