js简单表单验证代码示例
<html><head><style>#d1{left:30;top:30;width:440;height:300;position:absolute;background-color:#cccccc;}#d1_head{height:30;font-size:20pt;color:white;background-color:blue;}#d1_body{padding-top:40;padding-left:40;}.s1{color:red;}.s2{background-color:#ffee55;}</style><script>function valiForm(){return valiName() && valiPwd();}function valiName(){//step1 先找到要操作的节点var obj = document.getElementById('name');//className属性：用于设置或者读取//节点的class属性值。obj.className='';var msg = document.getElementById('name_msg');msg.innerHTML='';//step2 对节点的操作//value属性 ： (input控件 + textarea)的值var v1 = obj.value;if(v1.length==0){//innerHTML: 可以读取或者设置//标记之间的内容msg.innerHTML='名字不能为空';obj.className='s2';return false;}else{return true;}}function valiPwd(){var obj = document.getElementById('pwd');obj.className='';var msg = document.getElementById('pwd_msg');msg.innerHTML='';if(obj.value.length==0){msg.innerHTML='密码不能为空';obj.className='s2';return false;}else{return true;}}</script></head><body style="font-size:20pt;"><div id="d1"><div id="d1_head">表单数据验证</div><div id="d1_body"><form action="" method="" onsubmit="return valiForm();"><table><tr><td>name</td><td><input type="text" name="name" id="name" onblur="valiName();"/><span id="name_msg"></span></td></tr><tr><td>password</td><td><input type="password" name="pwd" id="pwd" onblur="valiPwd();"/><span id="pwd_msg"></span></td></tr><tr><td colspan="2"><input type="submit" value="confirm"/> <input type="reset" value="reset"/></td></tr></table></form></div></div></body></html>