input[type=“number“]去掉右侧箭头并限制输入长度

1、用 CSS 去掉右侧箭头

input.no-spin::-webkit-outer-spin-button,
input.no-spin::-webkit-inner-spin-button {
    -webkit-appearance: none!important;
}
input.no-spin[type="number"] { -moz-appearance: textfield; }
input.no-spin {
    background: transparent;
    color: #aaa;
    border: 1px solid #aaa;
}

2、限制输入长度

当 input 的 type 为 text 的时候，使用 maxlength 可以有效限制输入长度。

当 type 为 number 的时候，设置 maxlength 限制输入长度就会失效，长度可以无限输入。

解决方法：
上述即为使用 oninput 方法监听用户输入行为，当值得长度大于 4 的时候，用 slice 方法截取前 4 位的数字。

<input type="number" oninput="value = (value.length > 4 ? value.slice(0, 4) : value)">