微信小程序如何做金額輸入限制

 引言：金額輸入時，需求如下：

　　1）首位不能出現0或者小數點（.）

　　2）僅保留兩位小數

　　3）僅保留一個小數點（.），不允許出現多個。

 1.wxml核心代碼：

<!-- 1.adjust-position:true  鍵盤彈起時，是否自動上推頁面 2.bindinput="inputedit":類似雙向綁定，實現實時獲取輸入框值 3.type='digit' 帶小數點的數字鍵盤-->
<input type='digit' class='n-input' placeholder='請輸入充值金額' bindinput="inputedit" adjust-position="true" value="{{moneyNum}}"/>

2.js核心代碼：

data: {
    // 用戶輸入的金額
    moneyNum:null
},
/**
 * @method: 雙向綁定，實時獲取輸入框值
 * @params: event形參必須有，返回輸入框相關對象
 */
inputedit:function(event){
  this.setData({
    moneyNum: this.money(event.detail.value)  //money匹配金額輸入規則，返回輸入值
  });
},
/**
 * @method: 金額輸入限制
 * @params: val接收number值
 */
money(val) {
  let num = val.toString(); //先轉換成字符串類型
  if (num.indexOf('.') == 0) { //第一位就是 .
    num = '0' + num
  }
  num = num.replace(/[^\d.]/g, "");  //清除“數字”和“.”以外的字符
  num = num.replace(/\.{2,}/g, "."); //只保留第一個. 清除多余的
  num = num.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
  num = num.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能輸入兩個小數
  if (num.indexOf(".") < 0 && num != "") {
    num = parseFloat(num);
  }
  return num
}

結果如下圖：