注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

北漂的小羊

Java编程,开发者,程序员,软件开发,编程,代码。新浪微博号:IT国子监

 
 
 

日志

 
 
关于我

在这里是面向程序员的高品质IT技术学习社区,是程序员学习成长的地方。让我们更好地用技术改变世界。请关注新浪微博号: IT国子监(http://weibo.com/itguozijian)

网易考拉推荐

jQuery框架中增加对输入框的验证(验证框架)实例  

2012-07-28 11:52:44|  分类: JQuery |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
jQuery框架中增加对输入框的验证

在设计页面表单时,常常因为需要写大量的验证信息,还要写复杂的正则表达式,现在这样一个验证框架可以解决这样的繁杂问题。jQuery AlphaNumeric
实例:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="zh-tw">
<head>
<meta name="Generator" content="EditPlus" />
<meta name="Author" content="http://iteye.blog.163.com/" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link type="text/css" rel="stylesheet" href="../../style.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.alphanumeric.js"></script>
<title>jQuery AlphaNumeric 0.1.1</title>
<style type="text/css">
.tb{
border: 1px solid #ccc;
padding: 5px;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
</style>
<script type="text/javascript">
$(function(){
// 只允许输入英文数字
$(".sample1").alphanumeric();
// 除了允许输入英文数字之外,还接受 . , 及空白
$(".sample2").alphanumeric({
allow:"., "
});
// 只允许允许小写英文
$(".sample3").alpha({
nocaps:true
});
// 只允许允许数字
$(".sample4").numeric();
// 除了允许允许数字之外,还接受 .
$(".sample5").numeric({
allow:"."
});
// 自定义规则,除了 . 1 a 之外都能輸入
$(".sample6").alphanumeric({
ichars:'.1a'
});
});
</script>
</head>
<body>
<h3>只允许允许英数字</h3>
<input type="text" class="sample1 tb" />

<h3>除了允许允许英文数字之外,还接受 . , 及空白</h3>
<input type="text" class="sample2 tb" />

<h3>只允许允许小写英文</h3>
<input type="text" class="sample3 tb" />

<h3>只允许允许数字</h3>
<input type="text" class="sample4 tb" />

<h3>除了允许允许数字之外,还接受 .</h3>
<input type="text" class="sample5 tb" />

<h3>自訂規則,除了 . 1 a 之外都能输入</h3>
<input type="text" class="sample6 tb" />
</body>
</html>
  评论这张
 
阅读(455)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2016