</div>
<div class="lbd clearfix" id="bdctop"><script type="text/javascript">dy("art_up")</script></div>
<div id="content">
<div class="htmlarea"><TEXTAREA id="runcode97095">
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="javascript">
//自定义属性解释(IE支持):
//ii_chname：表示该数据的中文名称
//ii_minsize:表示允许输入的最小长度,单位字节
//ii_maxsize：表示允许输入的最大长度,单位字节
//ii_type:输入的数据类型
//ii_null：表示输入值是否允许为空。为yes时允许为空。
//ii_compare:比交是否与某项(ID)值相同
function chkRadio(o){
//判断单选
for (i=0;i<o.length;i++){
if (o[i].checked) return true;
}
return false;
}
function strlen(str){
/* 取得字符串的字节长度 */
var i;
var len;
len = 0;
for (i=0;i<str.length;i++)
{
if (str.charCodeAt(i)>255) len+=2; else len++;
}
return len;
}
function isnull(str){
/* 检测字符串是否为空 */
var i;
for (i=0;i<str.length;i++)
{
if (str.charAt(i)!=' ') return false;
}
return true;
}
function isNum(s) {
/* 检测字符串是否为数字 */
var regu = "^[-+]?\d*$";//支持正负\小数
//var regu = "^([0-9]*)$";
//var regu = "^([0-9]*[.0-9])$"; // 小数测试
var re = new RegExp(regu);
if (s.search(re) != -1)
return true;
else
return false;
}
function isType(s,t){
/* 检测数据类型是否合法 */
var RegExpPtn;
var t2=t;
if (t2 != ""){
switch(s){
case "EN"://英文
RegExpPtn=/^[A-Za-z]+$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "CN"://中文
RegExpPtn=/^[\u4e00-\u9fa5]+$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "NUM"://实数
RegExpPtn=/^(\+|-)?\d+($|\.\d+$)/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "INT"://正整数
RegExpPtn=/^[1-9]d*$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "DATE"://日期yyyy-mm-dd
RegExpPtn=/^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "EMAIL"://邮件
RegExpPtn=/\w[\w.-]+@[\w-]+(\.\w{2,})+/gi;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "CARD"://身份证,也可直接调用isCard()函数
return isCard(t2)
break;
case "URL"://网址
RegExpPtn=/^[a-zA-z]+\:\/\/(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "IP"://IP地址,,也可直接调用isIP()函数
return isIP(t2)
break;
case "ID1"://ID类型1,充许英文+数字+下划线(0~30字节)
RegExpPtn=/^[a-zA-Z][a-zA-Z0-9_]{0,29}$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
case "ID2"://ID类型1,充许中文+英文+数字+下划线(0~30字节)
RegExpPtn=/^[a-zA-Z][a-zA-Z0-9_][_0-9a-zA-Z\u4e00-\u9fa5]{0,29}$/;
if (!RegExpPtn.test(t2) ){return false;}else{return true;}
break;
default : break;
}
}else{
return false;
}
}
function isCard(obj){
/*功能：验证身份证号码是否有效 */
var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"};
var iSum = 0;
var info = "";
var strIDno = obj;
var idCardLength = strIDno.length;
if(!/^\d{17}(\d|x)$/i.test(strIDno)&&!/^\d{15}$/i.test(strIDno))
{
//alert("非法身份证号");
return false;
}
//在后面的运算中x相当于数字10,所以转换成a
strIDno = strIDno.replace(/x$/i,"a");
if(aCity[parseInt(strIDno.substr(0,2))]==null)
{
//alert("非法地区");
return false;
}
if (idCardLength==18)
{
sBirthday=strIDno.substr(6,4)+"-"+Number(strIDno.substr(10,2))+"-"+Number(strIDno.substr(12,2));
var d = new Date(sBirthday.replace(/-/g,"/"))
if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate()))
{
//alert("非法生日");
return false;
}
for(var i = 17;i>=0;i --)
iSum += (Math.pow(2,i) % 11) * parseInt(strIDno.charAt(17 - i),11);
if(iSum%11!=1)
{
//alert("非法身份证号");
return false;
}
}
else if (idCardLength==15)
{
sBirthday = "19" + strIDno.substr(6,2) + "-" + Number(strIDno.substr(8,2)) + "-" + Number(strIDno.substr(10,2));
var d = new Date(sBirthday.replace(/-/g,"/"))
var dd = d.getFullYear().toString() + "-" + (d.getMonth()+1) + "-" + d.getDate();
if(sBirthday != dd)
{
//alert("非法生日");
return false;
}
}
return true;
}
function isIP(obj)
{
var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/; //IP正则
if(re.test( obj ))
{
if( RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256) return true;
}
//alert("请输入合法的计算机IP地址");
return false;
}
function verifyInput(input)
{//检测指定自定义元素
var i;
var msg="";
var error = false;
var v=input.value;
if((input.ii_null != undefined)&&(input.ii_null != "")&&(error==false)){
if (input.ii_null=="NO"&&isnull(v))
{
//为空校验
msg +="*"+input.ii_chname+"值不能为空\n";
error = true;
}
}
if((input.ii_type != undefined)&&(input.ii_type != "")&&(error==false)){
//检查类型
switch(input.ii_type){
case "EN":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"只能输入英文字符\n";
error = true;
}
break;
case "CN":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"只能输入中文字符\n";
error = true;
}
break;
case "NUM":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"值应该全为数字\n";
error = true;
}
break;
case "INT":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"只能输入整数\n";
error = true;
}
break;
case "DATE":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"填写错误(参考:2000-12-28)\n";
error = true;
}
break;
case "EMAIL":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"填写错误(参考:abc@163.com)\n";
error = true;
}
break;
case "CARD":
if(isCard(v)==false){
msg +="*"+input.ii_chname+"填写错误,请检查\n";
error = true;
}
break;
case "URL":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"填写错误(参考:http://www.xxxx.com)\n";
error = true;
}
break;
case "IP":
if(isIP(v)==false){
msg +="*"+input.ii_chname+"填写错误,请检查\n";
error = true;
}
break;
case "ID1":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"填写错误(允许输入字母、数字和下划线)\n";
error = true;
}
break;
case "ID2":
if (isType(input.ii_type,v)==false){
msg +="*"+input.ii_chname+"填写错误(允许输入中文、字母、数字和下划线)\n";
error = true;
}
break;
default : break;
}
}
if((input.ii_minsize != undefined)&&(input.ii_minsize != "")&&(error==false)){
if (strlen(v)<parseInt(input.ii_minsize))
{
//最小长度校验
msg +="*"+input.ii_chname+"内容太短(最少需"+input.ii_minsize+"个字节)\n";
error = true;
}
}
if((input.ii_maxsize != undefined)&&(input.ii_maxsize != "")&&(error==false)){
if (strlen(v)>parseInt(input.ii_maxsize))
{
//最大长度校验
msg +="*"+input.ii_chname+"超出最大长度("+input.ii_maxsize+"个字节)\n";
error = true;
}
}
if((input.ii_compare != undefined)&&(error==false)){
var chv=document.getElementById(input.ii_compare).value;
if ((chv != undefined)&&(chv != ""))
{
if(chv != v){
msg +="*"+input.ii_chname+"与"+document.getElementById(input.ii_compare).ii_chname+"内容不相符，请检查\n";
error = true;
}
}
}
if(error) alert(msg);
return error;
}
function chkFromAll(myform)
{ //检测所有自定义元素
var i;
for (i=0;i<myform.elements.length;i++)
{
if (myform.elements[i].ii_chname==undefined) continue;//跳过非自定义元素
if (verifyInput(myform.elements[i])==true)//检测当前元素
{
myform.elements[i].focus();
return false;
}
}
return true;
}
</script>
<title>无标题文档</title>
<style type="text/css">
<!--
body,td,th {
font-size: 13px;
color: #666666;
}
.STYLE1 {color: #FF0000}
-->
</style></head>
<body>
<table width="80%" border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td height="100" valign="top" bgcolor="#FFFFFF">JS通用表单Input检测块(IE支持)
通过自定义每一个Input的六个新属性(可省略任意个)
//自定义属性解释(IE支持):
//ii_chname：表示该数据的中文名称
//ii_minsize:表示允许输入的最小长度,单位字节
//ii_maxsize：表示允许输入的最大长度,单位字节
//ii_type:限制输入的数据类型，有
EN(英文),CN(中文),NUM(实数),INT(整数),DATE(短日期),EMAIL(邮件)
CARD(身份证),URL(网址),IP(IP地址),ID1(英文帐号),ID2(中英文帐号)
//ii_null：表示输入值是否允许为空。为yes时允许为空。
//ii_compare:比交是否与某项(ID)值相同
然后有二种检测方式，
一是在Input里直接加入onBlur="verifyInput(this);" 事件，可即时检测提示
二是在Form中onsubmit="return chkFromAll(this);"，提交才检测
使用可以直接本页内script部份另存为Form_Common.js包含就可以用，解决绝大部份表单检测
问题，与后台编程语言无关，加快后台程序编写效率，让你我更专注于后台编写 :)
由于众所周知的原因，FF等貌似不支持自定义属性，暂无解决方法(鄙视一下)。要想兼容可以自
写chkfrom函数利用document.getElementById('ID')和JS文件内函数来检测，也会加快效率
这只是我的web程序设计增效工具(Eff.Studio)的一部份，有朋友需要的话迟点我会公开由表直接自动生成表单工具、自动建立后台(含增加、列表、编辑、删除)的Class(因工作需要，暂只做ASP版)
将大大加快设计效率~~~支持啦~(支持转载，拷贝不究，恳留作者信息)</td>
</tr>
</table>
<span class="STYLE1">演示表单：</span>
<form id="form1" name="form1" method="post" action="Demo.html" onsubmit="return chkFromAll(this);">
<table width="80%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td width="20%" height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>注册帐号：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n1" type="text" id="n1" size="20" maxlength="16" onBlur="verifyInput(this);" ii_chname="注册帐号" ii_minsize="4" ii_maxsize="16" ii_type="ID1" ii_null="NO" />
(帐号只能由英文、数字和下划线组成,5-16个字符)</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>登陆密码：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n2" type="text" id="n2" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="登陆密码" ii_maxsize="50" ii_null="NO" />
</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>重复密码：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n3" type="text" id="n3" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="重复密码" ii_maxsize="50" ii_null="NO" ii_compare="n2" />
</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>真实姓名：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n4" type="text" id="n4" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="真实姓名" ii_maxsize="50" ii_type="CN" ii_null="NO" />
(只能为中文)</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>联系邮件：</td>
<td bgcolor="#FFFFFF"><label>
<input name="mail" type="text" id="mail" size="20" maxlength="50" />
</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF"><span class="STYLE1">*</span>联系QQ：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n5" type="text" id="n5" size="20" maxlength="50" onBlur="verifyInput(this);" ii_chname="联系QQ" ii_maxsize="50" ii_type="NUM" ii_null="NO" />
(只能为数字)</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF">联系地址：</td>
<td bgcolor="#FFFFFF"><label>
<input name="n6" type="text" id="n6" size="30" maxlength="50"/>
</label></td>
</tr>
<tr>
<td height="25" align="right" bgcolor="#FFFFFF">自我简介：</td>
<td bgcolor="#FFFFFF"><label>
<textarea name="n7" cols="50" rows="8" id="n7" onBlur="verifyInput(this);" ii_chname="自我简介" ii_maxsize="200"></textarea>
(最多100个字)</label></td>
</tr>
<tr>
<td height="35" align="right" bgcolor="#FFFFFF"> </td>
<td bgcolor="#FFFFFF"><label>
<input type="submit" name="Submit" value=" 提交 " />
<input type="reset" name="Submit2" value=" 重置 " />
</label></td>
</tr>
</table>
</form>
</body>
</html>
相关推荐
5. 可扩展性：由于`validate`是一个通用类，因此它设计时考虑了可扩展性，方便与其他JavaScript库（如jQuery、React、Vue等）结合使用，同时可以通过插件形式添加更多功能。 6. 轻量级：`validate`类通常体积小巧，...
### JavaScript中通用的两个非空检测函数 在前端开发领域，特别是使用JavaScript进行表单验证时，非空检测是非常常见的需求之一。对于新手而言，掌握几种简单有效的非空检测方法非常有帮助。本文将详细介绍两种常用...
### 使用JavaScript语言进行表单验证 #### JavaScript与表单验证的重要性 随着互联网技术的飞速发展，表单作为用户向服务器提交数据的主要方式之一，在现代Web应用中扮演着至关重要的角色。为了确保提交的数据准确...
以下是一些关于如何使用JavaScript检测`input`元素是否为空的知识点。 1. **获取输入元素**： 首先，你需要获取到`<input>`元素。可以通过`document.getElementById()`, `document.querySelector()`或`document....
"validate 通用Ajax无刷新表单验证类"就是针对这一需求设计的，旨在提供一个高效、便捷的解决方案，使得在用户填写表单时能够实时进行数据验证，无需等待页面刷新，极大地提高了用户体验。 Ajax（Asynchronous ...
javascript,小程序,uni-app通用的验证类,内置常用的验证方法。。//使用用方法 /* *valit_rule验证规则 *value，验证数据form *true ，一次性全部检测完 / //var vali_result = validate.check(this.data.valit_rule,...
7.1检测页面何时完成载入 7.2使用Event对象捕获鼠标点击事件的位置 7.3创建一个通用的、可重用的事件处理函数 7.4根据修改的条件来取消一个事件 7.5阻止事件在一组嵌套元素中传播 7.6捕获键盘活动 7.7...
2. **表单验证**：JavaScript可以实时检查表单输入的有效性，如确保电子邮件地址格式正确，避免用户提交错误数据。 3. **动画与视觉效果**：利用JavaScript，可以创建复杂的动画效果，提升网站的视觉吸引力。 4. **...
通用JS表单验证类_validator实例演示，含有一个说明文档，本验证插件可对表单中常见的电话、字符、邮箱地址、网址、身份证号码、密码、年龄格式、IP格式等特殊的字符格式做出检测判断，避免用户提交到数据库的数据不...
由于提供的文件内容中包含的网址***重复出现，且没有提供实际的正文内容，我将基于文件的标题和描述以及IT行业通用知识点来构建相关知识点。 ### JavaScript与HTML实用教程知识点整理 #### 1. JavaScript基础 - **...
JavaScript 是世界上最流行的脚本语言。 JavaScript 是属于 web 的语言，...JS-注册表单检测雏形 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>JS-注册表单<
监听键盘事件，当检测到回车键时，使用 JavaScript 自动将焦点转移到下一个输入框。 ##### 三、制作输入提示特效 使用 JavaScript 监听输入框的变化，在用户输入时显示提示信息。 ##### 四、制作内容动态改变的层...
最后提到的方法是关于表单字段的通用验证机制，涉及使用HTML和JavaScript结合的方式进行输入验证。例如，通过设置`<input>`标签的`name`属性、`title`属性等，配合JavaScript代码进行实时的输入合法性检查，确保用户...
JavaScript与Java虽然名字相似，但两者是完全不同的语言，JavaScript主要是在客户端的浏览器上运行，而Java则是一种更通用的面向对象的编程语言。 JavaScript的核心特性包括： 1. **事件驱动**：JavaScript可以对...
### 通用登录验证知识点 #### 一、概述 在现代Web开发中，登录验证是确保网站安全的关键步骤之一。本文将详细介绍如何使用JavaScript实现一个简易的登录验证功能，该功能适用于简单的JSP页面管理。 #### 二、核心...
设置当前页面为主页也是网站常用的一个功能，可以方便用户快速访问。在提供的代码片段中，`SetHome`函数实现了这一功能。 1. **IE浏览器**：通过`window.external.addFavorite()`实现。 - **示例**： ```...
1. 字符串长度限制：在HTML表单中，可以使用JavaScript检测用户输入的字符串长度。例如，下面的代码限制了textarea的最大字符数为50，如果超过这个限制，会弹出警告并使焦点返回到该字段。 ```html function test...
在网页表单验证、用户体验优化等方面，JavaScript扮演着至关重要的角色。本压缩包包含了一系列实用的JavaScript函数，旨在帮助开发者实现各种验证功能，提高网站的用户友好性和安全性。 1. **倒计时功能**： 倒...
11.5.4 创建一款通用的客户端表单校验组件 11.6 其他内置对象 11.6.1 Navigator对象--浏览器总体信息的代表 11.6.2 Screen对象--提供显示器分辨率和可用颜色数量信息 11.6.3 Location对象--当前...