js格式化输入框的银行卡、金额

页面代码

<div class="wrap">

  <input type="text" id="bankCard" placeholder="输入银行卡号">

</div 

<div class="wrap">

  <input type="text" id="moneyNum" placeholder="输入金额">

</div>

//卡号每4位一组格式化

    $("#bankCard").on("keyup", formatBC);

  

    function formatBC(e){

  

      $(this).attr("data-oral", $(this).val().replace(/\ +/g,""));

      //$("#bankCard").attr("data-oral")获取未格式化的卡号

  

      var self = $.trim(e.target.value);

      var temp = this.value.replace(/\D/g, '').replace(/(....)(?=.)/g, '$1 ');

      if(self.length > 22){

        this.value = self.substr(0, 22);

        return this.value;

      }

      if(temp != this.value){

        this.value = temp;

      }

    }

/*

    * 金额每3位数一组逗号隔开格式化

    * 1.先把非数字的都替换掉

    * 2.由于IE浏览器对于change事件存在兼容问题,改用focus和blur事件代替。

    * */

    $("#moneyNum").on("keyup", formatMN);

  

    $("#moneyNum").on({

      focus: function(){

        $(this).attr("data-fmt",$(this).val()); //将当前值存入自定义属性

      },

      blur: function(){

        var oldVal=$(this).attr("data-fmt"); //获取原值

        var newVal=$(this).val(); //获取当前值

        if (oldVal!=newVal) {

          if(newVal == "" || isNaN(newVal)){

            this.value = "";

            return this.value;

          }

          var s = this.value;

          var temp;

  

          if(/.+(\..*\.|\-).*/.test(s)){

            return;

          }

          s = parseFloat((s + "").replace(/[^\d\.\-]/g, "")).toFixed(2) + "";

          var l = s.split(".")[0].split("").reverse(),

              r = s.split(".")[1];

          t = "";

          for(i = 0; i < l.length; i ++ ) {

            t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length && (l[i+1]!='-')? "," : "");

          }

          temp = t.split("").reverse().join("") + "." + r;

          this.value = temp;

          return this.value;

        }

      }

    });

  

    function formatMN(e){

      this.value = this.value.replace(/[^\d\.\-]/g,"");

      $(this).attr("data-oral", parseFloat(e.target.value.replace(/[^\d\.-]/g, "")));

      //$("#moneyNum").attr("data-oral")获取未格式化的金额

    }

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值