為什麼input中的maxlength屬性失效了

今天在遇到限制某個輸入框的最大長度的需求，比如一個要求輸入手機号的輸入框：當時我是這樣寫的

<input type="text" placeholder="請輸入手機号碼" maxlength="11" />      

如果是上面的這種寫法的話，maxlength屬性是有效的。但是type=”text”有一個不好的體驗，就是擷取焦點後彈出的輸入法是預設拼音的那種，不太适合此處要求純數字的需求。那麼自然會想到改為type=”number”，改為後你會奔潰， 竟然發現maxlength屬性不起作用了，可以無限地輸入，明明number是限制數字，為什麼長度會失效呢，刨根問底。

<input type="number" placeholder="請輸入手機号碼" oninput="if(value.length>11)value=value.slice(0,11)" />