一个jquery小插件, 实现限制文本框中输入的数据类型及长度

一个jQuery插件,实现限制文本框中输入的数据的类型及长度


   

;(function($){	 
	 $.fn.onlyAllowEnter = function(settings){
	 	 options = $.extend({}, $.fn.onlyAllowEnter.defaults, settings);
	 	 if(this.length == 0){
				debug('Selector invalid or missing!');
				return ;
		   }else if(this.length > 1){
			 return this.each(function() {
			   $.fn.onlyAllowEnter.apply($(this), [settings]);
		     });
		  }
	 	 
	 	 switch(options['type']){
	 	 	 case 'num':
	 	 	     $(this).unbind('keydown').keydown(allowEnterNumber);
	 	 	    break;
	 	 	 case 'ch':			    
	 	 	    $(this).unbind('keydown').keydown(allowEnterChar);
	 	 	    break;
	 	 	 case 'numch':
	 	 	    $(this).unbind('keydown').keydown(allowEnterNumberOrChar);
	 	 	    break;
	 	 	 case 'zto':
	 	 	    $(this).unbind('keydown').keydown(allowEnterNumberZero2One);
	 	 	    break;
	 	 	 case 'fnum':
	 	 	    $(this).unbind('keydown').keydown(allowEnterFloat);
	 	 	    break;
	 	 	 default:
	 	 	    return;
	 	 }
	 	 
	 };
	
	
	 function debug(message){
	 	 if(!window.console){
	 	 	 window.console = {};
	 	 	 window.console.log = function(){
	 	 	 	return;
	 	 	 }
	 	 }
	 	 window.console.log(message + ' ');	 	
	 };
	  
	 /**
	  * 设置文本框输入限制的默认配置
	  *  type: 文本框只能输入的类型,合法的值有:
	  *          num: 只允许是数字,ch: 只能是字母,numch: 数字或字母,zto: 0-1值浮点数,fnum: 浮点数
	  *  len: 允许输入的最大个数
	  *  intLen: 当为浮点数时允许的整数的最大位数, 默认为:0 不限制,如果为zto是此属性无作用
	  *  flatLen: 当为浮点数时允许的小数部分的最大位数。
	  */
	 $.fn.onlyAllowEnter.defaults = {
		     'type': '',
			 'len': 0,
			 'intLen': 0,
			 'flatLen': 0	
	 };
	 
	  /**
	   * 方法说明
	   *      只允许某个文本框中输入0~1之间的数值。当用户输入数值时,
	   *    会自动在输入的数值前面添加'0.';
	   * 参数说明:
	   *     @param element input文本框对象
	   * 使用方式:
	   *     为指定的文本框绑定onKeyDown事件,
	   */
     function allowEnterNumberZero2One(){
	     var keyCode = event.keyCode;
		 var _val = $(this).val();
		 if(_val == '' || !(/^0\./).test(_val)){
		    $(this).val('0.');
		 }
		 if(!onlyNumber(keyCode)){
		    return false;
		 }
        var len = options['flatLen'];
        _val = $(this).val().substring(2);
		debug(_val);
        if(len != undefined && len != 0 && _val.length >= len && isBackspace(keyCode)){
		   return false;
		}		
		return true;
	 };
	 
	 /** 
	  * 方法说明:
	  *     判断输入的数值是否为数字、删除、退格、左移或右移键
	  * 参数说明:
	  *  @param keyCode 输入的键盘的键值
	  */
	 function onlyNumber(keyCode){
		 if(isBackspace(keyCode) && (keyCode > 57 || keyCode < 48)){
		     return false;
		 }
		 return true;
	 };
	 
	 function isBackspace(keyCode){ 
	    return keyCode != 8 && keyCode != 46 && keyCode != 37 && keyCode != 39;
	 }
	 
	 /**
	  * 方法说明:
	  *   设置一个文本框中可以输入数值或浮点数。
	  * 参数说明:
	  *   @param element input文本框对象
	  * 使用方式
	  *   为指定的文本框绑定onKeyDown事件
	  */
	 function allowEnterFloat(){
	    var keyCode = event.keyCode;
		var _val = $(this).val();
		if(keyCode == 190){
	       if(_val == ''){
		      $(this).val('0');
		   }else if(_val.indexOf('.') != -1){
		      return false;
		   }
		}
		var ilen = options['intLen'];
		var flen = options['flatLen'];
		return  onlyNumber(keyCode) || keyCode == 190;
	 };
	  
      /**
       * 方法说明:
       *   设置一个文本框中只能输入字母
       * 参数说明:
       *   @param {HTMLObject} element input元素对象
       *   @param {Number} len 文本框中允许输入的字母个数,如果为空则为不限制
       */	  
	function  allowEnterChar(){
	    var keyCode = event.keyCode;
		if(isBackspace(keyCode) && (keyCode < 65 || keyCode > 90)){
		   return false;
		}
		
		var len = options['len'];
		var val = $(this).val();
		if(len != undefined  && len != 0 && (val.length >= len) && isBackspace(keyCode)){
		   return false;
		}
		return true;
	};
	
	/**
	 * 方法说明:
	 *    设置某个文本框中只能输入数字
	 * 方法说明:
	 *    @param {HTMLObject} element input元素对象
	 *    @param {Number} len 允许输入的数字的个数,当没指定时为无限制 
	 */
	function allowEnterNumber(){
	    var keyCode = event.keyCode;
		 if(!onlyNumber(keyCode)){
		    return false;
		 }
		 var _val = $(this).val();
		 var len = options['len'];
		 if(len != undefined && len != 0 && (_val.length >= len) && isBackspace(keyCode)){
		     return false;
		 }
		 return true;
	};
	
	/**
	 * 方法说明:
	 *    设置一个文本框只能输入数字或字母
	 * 参数说明:
	 *    @param {HTMLObject} element  input文本框对象
	 *    @param {Number} len 允许输入的字母或字母的最大数量
	 */
	function allowEnterNumberOrChar(){
		return allowEnterChar() || allowEnterNumber();
	}	
})(jQuery);
   

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值