zoukankan
html css js c++ java
“偷懒”的表单验证Demo
我们在做开发时,经常要做表单验证,比如验证文本框必须填内容时,而文本框又很多时,传统的做法是逐个判断: if (form1.name.value == "") { alert("Sorry,please input your name!") form1.focus(); } 这样一来要写的代码太多了,有没有“偷懒”的方法呢,答案是肯定的,请看下面的代码:
代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>“偷懒”的表单验证Demo</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="Generator" content="EditPlus" /> <meta name="Author" content="Dicky"> <meta name="Keywords" content="Name:Dicky;QQ:25941;MSN:HaiJunGu@HotMail.Com"> <meta name="Description" content="Name:Dicky;QQ:25941;MSN:HaiJunGu@HotMail.Com"> <script language="javascript" type="text/javascript"> <!-- //剪去字符串内的所有空格 function JsTrim(str) { var newstr = "" for(var jj = 0;jj < str.length;jj ++) { var tmpstr = str.substring(jj,jj+1); if (tmpstr != " ") { newstr = newstr + tmpstr; } } return newstr; } function CheckForm() { var obj = document.body.getElementsByTagName("input"); //列出所有标签为input的集合 for (var mm = 0; mm < obj.length; mm++) { if ((obj[mm].getAttribute("type") == "text") && (obj[mm].getAttribute("name") != "Address")) //不检查Address是否输入 { if (JsTrim(obj[mm].value) == "") { window.alert(obj[mm].getAttribute("ErrorMsg")); //弹出错误提示语 obj[mm].focus(); obj[mm].select(); return false; } } } document.form1.submit(); } //--> </script> </head> <body> <form name="form1" method="post" onsubmit="return CheckForm(this);"> <div>Name:<input type="text" name="Name" errormsg="Sorry,please input your name!" /></div> <div>Sex :<input type="text" name="Sex" errormsg="Sorry,please input your sex!" /></div> <div>Age :<input type="text" name="Age" errormsg="Sorry,please input your age!" /></div> <div>Addr:<input type="text" name="Address" /> <div><input type="submit" name="Submit" value="Submit" /> <input type="reset" name="Reset" value="Reset" /></div> </form> </body> </html>
[Ctrl+A 全选 提示:你可先修改部分代码,再点运行代码]
青苹果Web应用商店
https://webapp.taobao.com/
PHP/ASP.NET/ASP/UCHOME/DISCUZ! X系列网站开发,详细需求联系
QQ:8511978
查看全文
相关阅读:
linux sed的使用
linux 服务的操作
Js apply方法详解,及其apply()方法的妙用
call()方法和apply()方法
javascript中的深拷贝和浅拷贝
移动web适配利器-rem
js 函数讲解
try…catch 结构
Git使用之(pathspec master did not match any file(s) known to git)
微信小程序使用函数的三种方法
原文地址:https://www.cnblogs.com/Dicky/p/405563.html
最新文章
virtio使用
qemu编译
UVA-12083 Guardian of Decency 二分图 最大独立集
HDU-1083 Courses 二分图 最大匹配
CodeForces-766D Mahmoud and a Dictionary 并查集 维护同类不同类元素集合
SpaceVim配置中遇到的问题
[Debug]SpaceVim中neomake报错 Error while trying to load a compilation database
HDU-1257 最少拦截系统 贪心/DP 最长上升子序列的长度==最长不上升子序列的个数?
HDU-4221 Greedy? 贪心 从元素的相对位置开始考虑
HDU-4296 Buildings 贪心 从相邻元素的相对位置开始考虑
热门文章
HDU-1052 Tian Ji -- The Horse Racing 贪心 考虑特殊位置(首尾元素)的讨论
[专题-图论]最短路
android开发之网络棋牌类在线游戏开发心得(服务器端、Java) 好文章值得收藏
Conversion to Dalvik format failed with error 1
drozer安装之夜深模拟器
android安全测试 APP要点解析
使用Burpsuite抓取手机APP的HTTPS数据
使用burpsuite抓android包
linux awk的使用
linux sed和awk的区别
Copyright © 2011-2022 走看看