1. 程式人生 > >input 限制輸入長度及常見問題講解

input 限制輸入長度及常見問題講解

input 作為表單提交必備的標籤之一,存在的一些問題,在這講解一下

1.  限制輸入字元的長度問題

首先想到的一定是input中的maxlength屬性;注意的是 使用maxlength 的時候 只針對 type型別是 password text 兩個 其餘都不管用

<input type="password" maxlength="2" name="" id="" value="" />
<input type="text" maxlength="2" name="" id="" value="" />

2. 像我們表單驗證一下手機號 或者卡號開通會員等 需要用到的是 number 型別  輸入數字

問題: 並不是純數字 可以輸入字母 e  因為e 在數學中也屬於數字 e 代表 2.71828

解決:

<input type='number' onkeypress='return( /[\d]/.test(String.fromCharCode(event.keyCode)))' />

這樣就不能輸入e  只能輸入純數字   也不能輸入  負 -  小數點 .  

問題: number 型別下 也想要限制長度怎麼辦

解決:

<input type="number" class="form-control" oninput="if(value.length>2)value=value.slice(0,2)"  placeholder="請輸入">