表单验证—js循环所有表单验证
1、表单
<form id="regForm" method="post" action="index/register" onsubmit="checkForm(this)">
....
<td><label class="ui-green"><input type="submit" name="submit" value="提交注册" /></label></td>
2、验证form表单
function checkForm(frm)
{ var els = frm.getElementsByTagName("input");
for(var i=0; i<els.length; i++) {
if(typeof(els[i].getAttribute("onblur")) == "function") {
if(!CheckItem(els[i])) return false;
}
}
return true;
}
3、验证该表单下的所有input框
function CheckItem(obj)
{
//将input提示框的内容赋空
obj.parentNode.parentNode.className = ""; var msgBox = obj.parentNode.getElementsByTagName("span")[0];
switch(obj.name) { case "regUserName": //这后面的业务可以单独提出来作为一个方法
if(obj.value == "") {
msgBox.innerHTML = "密码不能为空!";
//添加className方便统一管理样式
msgBox.className = "error";
return false;
}else{
//用户名被占用
$.ajax({
"url":"index/hasname",
"data":"username="+obj.value,
"type":"post",
"dataType":"json",
"success":function(data){
if(data=="1"){
msgBox.innerHTML = "用户名已存在!";
msgBox.className = "error";
return false;
}else{
//用户名可用
msgBox.innerHTML = "用户名可用!";
msgBox.className = "nameinfo";
}
}
});
}
break; case "userName":
if(obj.value == "") {
msgBox.innerHTML = "密码不能为空!";
msgBox.className = "error";
return false;
}
break;
case "passWord":
if(obj.value == "") { msgBox.innerHTML = "密码不能为空!";
msgBox.className = "error";
return false;
}
break;
case "rePassWord":
if(obj.value == "") {
msgBox.innerHTML = "密码不能为空!";
msgBox.className = "error";
return false;
} else if(obj.value != document.getElementById("passWord").value) {
msgBox.innerHTML = "两次密码不一致!";
msgBox.className = "error";
return false;
}
break;
case "veryCode":
if(obj.value == "") {
msgBox.innerHTML = "验证码不能为空!";
msgBox.className = "error";
return false;
}
break;
}
return true;
}
表单验证—js循环所有表单验证的更多相关文章
- day32(表单校验js和jquery表单校验)
校验用户名.密码.密码一直性. <style> .error { color: red } .success { color: green } </style> <scr ...
- 查询数据表行数 然后循环查找表 添加数据到ITEMS
;i<tbBiao.Rows.Count;i++) { string TableName = (tbBiao.Rows[i]["Table"]).ToString(); tb ...
- js/jquery/插件表单验证
媳妇要学js,就收集一些资料给她. 1.js 表单验证 : http://hi.baidu.com/yanchao0901/item/161f563fb84ea5433075a1eb 2.jquery ...
- 在客户端先通过JS验证后再将表单提交到服务器
问题:想要在客户端先通过JS验证后再将表单提交到服务器 参考资料: jQuery 事件 - submit() 方法 试验过程: 服务器端使用PHP <html> <head> ...
- jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因
jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- 原生js制作表单验证,基本的表单验证方法
表单验证是web前端最常见的功能之一,也属于前端开发的基本功.自己完成一个表单验证的开发,也有助于加深对字符串处理和正则表达式的理解. 基本的表单验证包括如:字母验证.数字验证.字母和数字验证.汉字验 ...
- JS中的表单验证+正则表达式
表单验证+正则表达式 一.非空验证 trim:去空格(去掉前后的空格),任何字符串都可以用这个方法.写法为:if(v.trim().length==0),表示如果去掉空格后的字符串的长度为0. < ...
- 最常用的15个前端表单验证JS正则表达式
在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的JavaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份 ...
随机推荐
- Python 爬虫知识点
一.基础知识 1.HTML分析 2.urllib爬取 导入urilib包(Python3.5.2) 3.urllib保存网页 import urllib.requesturl = "http ...
- 服务器允许js跨域
header('Access-Control-Allow-Origin:*'); header('Access-Control-Allow-Methods:POST,GET'); header('Ac ...
- Zookeeper(三)-- JAVA原生API
一.前提 jar包:zookeeper-3.4.9.jar,slf4j-api-1.6.1.jar,slf4j-log4j12-1.6.1.jar,log4j-1.2.15.jar 二.Demo pa ...
- CentOS6.4配置163的yum源
CentOS系统自带的更新源的速度实在是慢,为了让CentOS6使用速度更快的YUM更新源,可以选择163(网易)的更新源. 1.下载repo文件 wget http://mirrors.163.co ...
- PHP创建文件以及移动文件
创建文件,这里用到的是fopen,即是打开,又是创建 <?php $counter_file = 'aa.txt ';//文件名及路径,在当前目录下新建aa.txt文件 $fopen = fop ...
- iOS富文本组件的实现—DTCoreText源码解析 数据篇
本文转载 http://blog.cnbang.net/tech/2630/ DTCoreText是个开源的iOS富文本组件,它可以解析HTML与CSS最终用CoreText绘制出来,通常用于在一些需 ...
- ios 图片处理( 1.按比例缩放 2.指定宽度按比例缩放
本文转载至 http://blog.sina.com.cn/s/blog_6f29e81f0101tat6.html //按比例缩放,size 是你要把图显示到 多大区域 CGSizeMake(300 ...
- poj_1743 后缀数组
题目大意 给定一串数字,长度为N.定义数字中的某个连续的子串为一个"theme",只要子串满足: (1)长度 >= 5 (2)和该子串相同或者该子串的“变种串”在整串数字中出 ...
- MQTT的学习研究(十一) IBM MQTT 简单发布订阅实例
package com.etrip.push; import com.ibm.mqtt.MqttAdvancedCallback; import com.ibm.mqtt.MqttClient; im ...
- Autofac在项目中应用的体会,一个接口多个实现的情况
在本人接触的项目中Autofac应用的比较多一些,我理解的他的工作原理就是 注册类并映射到接口,通过注入后返回相应实例化的类! 下面说说我在项目中的实际应用 先来简单介绍下Autofac的使用 1. ...