zoukankan      html  css  js  c++  java
  • 银行卡和手机号占位符

    银行卡

    手机号

    HTML

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title> 
            <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes" /> 
            <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        </head>
        <body>
            <input type="text" name="bankNumber" id="bankNumber"/>
        </body>
    </html>
    <script src="js/cutNumber.js"></script>
    <script>
        $("#bankNumber").cutNumber({type:"phone"}); 
    </script>

    JS

    /*
    	模拟手机和银行卡号间隔效果插件 
        如果银行卡 传参 {type:"bank"}
        如果是手机 传参 {type:"phone"}
    
     */
    ;(function ($) {
         	$.fn.extend({
             "cutNumber": function (options) { 
             	if (!isValid(options))
                    return this;
                //使用jQuery.extend 覆盖插件默认参数
                var opts = $.extend({}, options);
    
                //如果是银行使用,会执行444格式
                if(opts.type =="bank"){
                	$(this).prop({maxlength:23});
                	return this.on("keyup",function(){
                 	   this.value =this.value.replace(/s/g,'').replace(/D/g,'').replace(/(d{4})(?=d)/g,"$1 ");
                   })
                }else if(opts.type =="phone"){
                	$(this).prop({maxlength:13});
                 	return this.on("keyup",function(){
                 	   this.value =this.value.replace(/s/g,'').replace(/D/g,'').replace(/(d{3})(?=d)/,'$1 ').replace(/(d{4})(?=d)/,'$1 ');
                   })
     			
             	}else{
             		return this.on("keyup",function(){
             			this.value = this.value;
             		})
             	}
            }
         });
    
         //私有方法,检测参数是否合法
        function isValid(options) {
            return !options || (options && typeof options === "object") ? true : false;
        }
    })(window.jQuery);
    

      

  • 相关阅读:
    Matlab随笔之三维图形绘制
    Matlab随笔之模拟退火算法
    Matlab随笔之矩阵入门知识
    Matlab随笔之求解线性方程
    Matlab随笔之分段线性函数化为线性规划
    Matlab随笔之指派问题的整数规划
    Matlab随笔之线性规划
    Android单位转换 (px、dp、sp之间的转换工具类)
    Android禁止输入表情符号
    设计模式之策略模式
  • 原文地址:https://www.cnblogs.com/binmengxue/p/6723598.html
Copyright © 2011-2022 走看看