一.下載插件
http://digitalbush.com/projects/masked-input-plugin/
二。屬性
a: 表示只能輸入大小寫字母
9:表示只能輸入0-9之間的數字
*：a和9的結合
placeholder:占位符
三。方法
mask(param1,pararm2)：param1:限制輸入格式，param2:制定占位符
umask():刪除輸入格式的限制
四.擴展 方法
可以根據自己的需求限制輸入格式例如:
$.mask.definitions['z']='[123]';表示只能輸入123數字
五.例子
<!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></title>
<script type="text/javascript" src="http://zhyj0303.blog.163.com/blog/../../js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="http://zhyj0303.blog.163.com/blog/../../js/jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#txtdate").mask("99/99/9999", { placeholder: "|" });
$("#txtphone").mask("(999) 999-9999");
$("#txttin").mask("99-9999999");
$("#txtmax").mask("999/99/9999");
$("#txtdemo1").mask("**/***/****");
$("#txtdemo2").mask("aa/aaa/aaa");
//自定義格式
$.mask.definitions['z'] = '[123]';//Z:表示只能輸入123
$("#txtdemo3").mask("zz/ zzz/ zzzz");
});
</script>
</head>
<body>
<input type="text" id="txtdate" /><span style="color: Red">輸入格式(99/99/9999)</span><br />
<input type="text" id="txtphone" /><span style="color: Red">輸入格式((999)999-9999)</span><br />
<input type="text" id="txttin" /><span style="color: Red">輸入格式(99-99999999)</span><br />
<input type="text" id="txtmax" /><span style="color: Red">輸入格式(999-99-99999)</span><br />
<input type="text" id="txtdemo1" /><span style="color: Red">以(**/***/****)形式輸入大小寫字母和數字</span><br />
<input type="text" id="txtdemo2" /><span style="color: Red">以(aa/aa/aaa)形式輸入大小寫字母</span><br />
<input type="text" id="txtdemo3" /><span style="color: Red">自定義的輸入方式(zz/zzz/zzz)</span><br />
</body>
</html>
jQuery的maskedinput插件 設置input掩碼
免責聲明！
本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。