本文介绍如何使用JavaScript实现表单输入的非空验证。通过自定义trim函数去除字符串两端空格,并结合DOM操作获取表单元素值,判断用户名和密码是否为空。若为空则弹出提示并阻止提交,否则允许通过。
// 复制代码
JavaScript实现表单非空验证与Trim函数示例
代码如下:
// 去除输入字符串两端的空格
function trim(s) {
var count = s.length;
var st = 0; // 起始索引
var end = count - 1; // 结束索引
if (s == "") return s;
while (st < count) {
if (s.charAt(st) == " ")
st ++;
else
break;
}
while (end > st) {
if (s.charAt(end) == " ")
end --;
else
break;
}
return s.substring(st, end + 1);
}假设表单结构如下:
// 复制代码
代码如下:
<form action="testnew.html" name="form1">
username: <input type="text" name="name">
password: <input type="password" name="pwd"> <br>
<input type="submit" value="提交" onclick="isEmpty()">
</form>此时,判断输入是否为空的函数定义如下:
// 复制代码
代码如下:
function isEmpty(){
// form1对应form标签中的name属性
var _form = document.form1;
if(trim(_form.name.value)==""){
alert("用户名不能为空!");
return false;
}
if(trim(_form.pwd.value)==""){
alert("密码不能为空!");
return false;
}
return true;
}