zoukankan      html  css  js  c++  java
  • jQuery的maskedinput插件 设置input掩码

    一.下载插件
      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>

  • 相关阅读:
    缓存雪崩与缓存穿透
    读取表中最大值
    使用vscode在谷歌上运行代码
    elment 中tree组件展开所有和收缩所有节点
    深度系统商店提示无法安装软件依赖错误
    诗词,理解,品论
    《45个十分钟读懂资本论》原文、适合朗读版和个人见解
    《论持久战》全文
    OSError: [WinError 126] 找不到指定的模块。
    C++ 获取序列最大(或最小)的 N 个元素
  • 原文地址:https://www.cnblogs.com/wanghetao/p/3975698.html
Copyright © 2011-2022 走看看