javascript 如何检查文本框是否为空？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17804674/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to check whether a text box is empty or not?
提问by Rahul
I want to check whether a text box contains a name or not. If not then an alert should be popped up displaying a message after pressing a submit button and the page should not submit the blank value. If it contains value then the value should be submitted.
我想检查文本框是否包含名称。如果没有，则在按下提交按钮后应弹出警报并显示一条消息，并且页面不应提交空白值。如果它包含值，则应提交该值。
I am using the below code. When I leave the text box empty and click the submit button, it displays the alert as expected, but it also submits the empty value after dismissing the alert.
我正在使用以下代码。当我将文本框留空并单击提交按钮时，它会按预期显示警报，但在解除警报后也会提交空值。
<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>
What is the problem in the code?
代码中有什么问题？
回答by LUKE
You need to do onclick="return check();"
你需要做 onclick="return check();"
回答by Amit
Try this
试试这个
<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>
回答by Felix Kling
You return falsefrom the check, but you are notreturning the value from the event handler.
您false从返回check，但没有从事件处理程序返回值。
Only if the event handler returns false, the default action (submitting the form in this case) is prevented:
仅当事件处理程序返回时false，才会阻止默认操作（在这种情况下提交表单）：
onclick="return check();"
Have a look at the great introduction to event handlers at quirksmode.orgto learn the basics about event handling (and to learn about better ways than inline event handlers).
在 quirksmode.org上查看对事件处理程序的精彩介绍，以了解有关事件处理的基础知识（并了解比内联事件处理程序更好的方法）。
In general it is better to perform these checks not when the submit button is pressed but just before the form is submitted. So, instead of binding the handler to the clickevent on the button, bind it to the submitevent of the form, for example (using traditional event handlers):
一般来说，最好不要在按下提交按钮时而是在提交表单之前执行这些检查。因此，不要将处理程序绑定到按钮上的单击事件，而是将其绑定到表单的提交事件，例如（使用传统的事件处理程序）：
document.getElementById('frm1').onsubmit = function() {
if (!this.FileName.value) {
alert ("Please Enter a File Name");
return false;
}
};
The advantage is that the check will be done for all form submissions, not only when the submit button is clicked (for example if the submit button is "executed" by pressing the enter key).
优点是将对所有表单提交进行检查，而不仅仅是在单击提交按钮时（例如，如果提交按钮是通过按回车键“执行”的）。
