js控制文本域只能输入固定位的小数,并且位数不够的自动补零

        在页面填写部分信息的时候(如金额等),我们有时候需要校验他的有效性,比如只能输入整数,小数(指定位数),负数等等,下面给出一个自己写的JS,用来控制小数,各位看需求使用即可。下面的方法配合使用可以达到完美解决一个文本域的控制问题。

限制文本域只能输入固定位的小数

/**
* 控制文本域只能输入几位固定的位数 
* @param id 文本域的ID
* @param num 控制几位数(小数位)
* add by dyp  20190429
*/
function decimalDigit(id,num){
var zzDigit="";
for(i=0;i<num;i++){
zzDigit=zzDigit+"\\d";
}
var temp=new RegExp("^(\\-)*(\\d+)\\.("+zzDigit+").*$");//只能输入三位小数   $1表示:第一个括号里    $3 第三个括号里边,一个\d代表一个位数
$("#"+id).bind("keyup",function(){
   	this.value = this.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
   	this.value = this.value.replace(/^\./g,""); //验证第一个字符是数字
   	this.value = this.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
   	this.value = this.value.replace(temp,'$1$2.$3'); //只能输入三位小数   $1表示:第一个括号里    $3 第三个括号里边,一个\d代表一个位数
   });
   $("#"+id).bind("afterpaste",function(){
   	this.value = this.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
   	this.value = this.value.replace(/^\./g,""); //验证第一个字符是数字
   	this.value = this.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
   	this.value = this.value.replace(temp,'$1$2.$3'); //只能输入三位小数   $1表示:第一个括号里    $3 第三个括号里边,一个\d代表一个位数
   });
}

第一种方法为

// 1.格式化出标准的2位小数(其他位数的自己调整即可)

// 格式化出标准的2位小数    
function formatNum (num){ 
   var numMatch = String(num).match(/\d*(\.\d{0,2})?/); 
   return (numMatch[0] += numMatch[1] ? '00'.substr(0, 3 - numMatch[1].length) : '.00'); 
}

2.对应文本域自动补齐位数

//发票总金额格式化为2位数  
function invoiceTotalMoneyBlur(){
    $("#invoiceTotalMoney").blur(function(){
       var temp=$(this).val();
       $(this).val(formatNum(temp));	       	       
    });	   
},

 3.总体方法直接在页面加载时候加载进去即可,如下:

$(function(){
    decimalDigit("invoiceTotalMoney",2);//发票总金额只能输入两位数限制 
    invoiceTotalMoneyBlur();//发票总金额格式化为2位数 (写得不够两位数了自动补齐) 
});

第二种方法为:

1.格式化出标准的N位小数

/**
*小数位不齐的补全操作
*number 目标数值
*bitNum 需要补齐的位数
**/
function changeDecimalBuZero(number, bitNum) {
    var f_x = parseFloat(number);
    if (isNaN(f_x)) {
        return 0;
    }
    var s_x = number.toString();
    var pos_decimal = s_x.indexOf('.');
    if (pos_decimal < 0) {
        pos_decimal = s_x.length;
        s_x += '.';
    }
    while (s_x.length <= pos_decimal + bitNum) {
        s_x += '0';
    }
    return s_x;
}

2.使用方法如下:

<input id="voiceLandingMonthlyRent" name="voiceLandingMonthlyRent" type="text"  maxlength="30" class="input-small required" onclick="decimalDigit('voiceLandingMonthlyRent',4);" onblur="this.value=changeDecimalBuZero(this.value,4)"/>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值