文本框出現上下小箭頭 以及可以輸入除文字以外的符號

下面是寫登錄界面 手機號的一部分,發現在輸入框的右端會出現小箭頭

 

<div>
　　<input class="textbox" type="number" min="11" max="11" placeholder="手機號" id="phoneno">
</div>

//解決出現小箭頭的代碼

//該代碼控制箭頭不顯示
<style>
                input::-webkit-outer-spin-button,input::-webkit-inner-spin-button {
                -webkit-appearance: none;} input[type="number"] {
                -moz-appearance: textfield;}

  </style>

 

//接着我們會發現去掉箭頭后還會出現，可以輸入除數字以外的一些特殊字符
<div>
　　<input class="textbox" type="number" min="11" max="11" placeholder="手機號" 
     id="phoneno" οnkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
     style="ime-mode:Disabled" >
</div>

//這是我們可以加上

　　　οnkeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"
     style="ime-mode:Disabled" 
//這樣設置以后再去看就只允許輸入數字了，而且輸入該值的時候輸入法是禁用的，不允許調

//之后我們會發現仍可以輸入 ...  ---
//這是需要寫一個函數控制其不可輸入那幾個符號