HTML - 如何在 javascript 中对 textarea 的空值输入进行错误检查？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16908526/
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
HTML -How to do error checking for null value input of textarea in javascript?
提问by Mona
I want to do some error checking in the script for the input of a textarea, i.e. if there is no input, showing an alert. I've tried to use value="" value='' , but seems all cannot work.
我想在脚本中为 textarea 的输入做一些错误检查，即如果没有输入，则显示警报。我试过使用 value="" value='' ，但似乎都无法工作。
Field
场地
<div class="field">
<label>remarks:</label>
<textarea id="id_remarks" name="remarks"></textarea>
</div>
Save button
保存按钮
<input type="submit" value="Save" onclick="verify()"/>
Function
功能
<script>
function verify(){
if (document.forms[0].elements['id_remarks'].value=='') {
alert('Please enter the remarks')
}
</script>
Can anyone help on how to do it? thanks very much
任何人都可以帮助如何做到这一点？非常感谢
回答by RGV
var x=document.forms[0].elements['id_remarks'].value;
if(!x){} else {}
This checks for (""), null, undefined, falseand the numbers 0and NaN
这会检查(""), null, undefined,false以及数字0和NaN
Source :
来源 ：
回答by Mr Jerry
try it
尝试一下
function verify(){
if(!document.getElementById('id_remarks').value.trim().length){
alert("Please enter the remarks");
}
}
Updated: Fixed for IE version < 9
更新：针对 IE 版本 < 9 修复
In IE below version 9, it is not support .trim()
在版本 9 以下的 IE 中，不支持 .trim()
if(typeof String.prototype.trim !== 'function'){
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, '');
}
}
回答by RobG
Validation is more commonly applied to a form's submit handler since a form can be submitted without clicking the submit button.
验证更常应用于表单的提交处理程序，因为无需单击提交按钮即可提交表单。
Comparing the value of the control with "" (empty string) should work, however the value might be whitespace so you might want to remove that first, e.g.
将控件的值与“”（空字符串）进行比较应该可以工作，但是该值可能是空格，因此您可能希望先将其删除，例如
<form onsubmit= "return verify(this);" ...>
<textarea id="id_remarks" name="remarks"></textarea>
<input type="submit">
</form>
<script>
function verify(form) {
if (form.remarks.value.replace(/\s+/g,'') == '') {
alert('Please enter some remarks');
return false;
}
}
</script>
回答by Rajender Joshi
回答by Rajender Joshi
Comparing the .valueof the textareaobject to an empty string works fine (see this jsFiddle).
比较.value的的textarea对象为空字符串工作正常（见本的jsfiddle）。
The only think I can see that's odd about your code is the use of the .elementsproperty of the form object. I can't say that's it's wrong, just that it's not the way I'm used to seeing it done. I'm used to identifying DOM objects using document.getElementById().
我能看到的关于您的代码的唯一想法是使用.elements了表单对象的属性。我不能说这是错的，只是这不是我习惯看到它完成的方式。我习惯于使用document.getElementById().
In any case, the following works...
无论如何，以下工作...
HTML:
HTML：
<form id="f1" action="" method="post">
<label for="ta1">TextArea</label>
<br/>
<textarea id="ta1"></textarea>
<label for="result">Result:</label>
<input id="result" type="text"></input>
<br/>
<input type="submit" value="verify"></input>
</form>
JavaScript:
JavaScript：
var ta1 = document.getElementById("ta1");
var result = document.getElementById("result");
f1.onsubmit = function () {
if (ta1.value === "") {
result.style.color = "red";
result.value = "Blank";
} else {
result.style.color = "blue";
result.value = "Not Blank: '" + ta1.value + "'";
}
return false;
};
回答by Key Shang
You could use the requiredattribute in HTML5, it works on all modern browsers, even if users have javascript disabled. Example:
您可以required在 HTML5 中使用该属性，它适用于所有现代浏览器，即使用户禁用了 javascript。例子：
<form action="" method="post">
<input name="username" value="" title="username" required>
<input type="submit">
</form>回答by Sushanth --
Try to check for the length property
尝试检查长度属性
if (!document.forms[0].elements['id_remarks'].value.length) {
回答by Neobta
Fiddle working http://jsfiddle.net/Q4JPs/8/
小提琴工作http://jsfiddle.net/Q4JPs/8/
HTML
HTML
<div class="field">
<label>remarks:</label>
<textarea id="id_remarks" name="remarks"></textarea>
</div>
<button id='btn'>Click me</button>
js
js
document.getElementById('btn').onclick = function (){
if (document.getElementById('id_remarks').value =="")
{
alert("is Empty");
return;
}
}
