限制輸入框輸入數字
阿新 • • 發佈:2018-12-19
在一些場景下需要對輸入框進行一定的限制,比如輸入框只允許輸入合理的金額
HTML程式碼:
<input type="text" id="rechargeAmount" oninput="checkInput(this,10)" autofocus placeholder="請輸入充值金額">
js程式碼:
/** * 限制輸入框只能輸入數字和最大長度 * 如果是小數只能輸入到小數點後兩位 * @param {any} obj 輸入框物件 * @param {Number} maxLen 最大長度 */ function checkInput(obj, maxLen) { if (maxLen && obj.value.length > maxLen) {//判斷長度 obj.value = obj.value.slice(0, 10); } //修復第一個字元是小數點 的情況. if (obj.value !== '' && obj.value.substr(0, 1) === '.') { obj.value = ""; } //解決 貼上不生效 obj.value = obj.value.replace(/^0*(0\.|[1-9])/, '$1'); //清除“數字”和“.”以外的字元 obj.value = obj.value.replace(/[^\d.]/g, ""); //只保留第一個小數點(.)清除多餘的 obj.value = obj.value.replace(/\.{2,}/g, "."); obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", "."); //只能輸入兩個小數 obj.value = obj.value.replace(/^(\d+)\.(\d\d).*$/, '$1.$2'); if (obj.value.indexOf(".") < 0 && obj.value !== "") {//以上已經過濾,此處控制的是如果沒有小數點,首位不能為類似於 01、02的金額 if (obj.value.substr(0, 1) === '0' && obj.value.length === 2) { obj.value = obj.value.substr(1, obj.value.length); } } }
目前,本人測試可以使用,能夠達到效果。