在一些場景下需要對輸入框進行一定的限制,比如輸入框只允許輸入合理的金額
HTML代碼:
<input type="text" id="rechargeAmount" οninput="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);
}
}
}
目前,本人測試可以使用,能夠達到效果。