input限制只能輸入數字的三種方法

2021-10-02 22:41:17 字數 686 閱讀 9281

在前端開發過程中,我們經常需要對input輸入內容進行限制,比如驗證碼,購物車數量等等。下面我總結一下限制input只能輸入數字的幾種方法。

描述max

number

規定允許的最大值

minnumber

規定允許的最小值

step

number

規定合法的數字間隔(如果 step=「3」,則合法的數是 -3,0,3,6 等)

html5新增pattern屬性,用來規定驗證輸入欄位的正則匹配模式。

let input = document.

getelementbyid

('number');

input.

oninput

=function()

通過繫結input事件,使用replace方法配合正則即可實現。也可以通過繫結focusblurkeyup等事件。

限制 input 輸入框只能輸入數字

1 onkeyup value value.replace d g,使用 onkeyup 事件,有 bug 那就是在中文輸入法狀態下,輸入漢字之後直接回車,會直接輸入字母 2 onchange value value.replace d g,使用 onchange 事件,在輸入內容後,只有 inpu...

限制input輸入框只能輸入數字

1 onkeyup value value.replace d g,使用 onkeyup 事件,有 bug 那就是在中文輸入法狀態下,輸入漢字之後直接回車,會直接輸入字母 2 onchange value value.replace d g,使用 onchange 事件,在輸入內容後,只有 inpu...

限制 input 輸入框只能輸入純數字

限制 input 輸入框只能輸入純數字 1 onkeyup value value.replace d g,使用 onkeyup 事件,有 bug 那就是在中文輸入法狀態下,輸入漢字之後直接回車,會直接輸入字母 2 onchange value value.replace d g,使用 onchan...