限制input输入长度与内容

1、限制输入长度

• 如果输入的是数字(type是number类型)，通过监听input事件再通过slice进行截取限制长度

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

• 如果输入的是文字或者字符（type是text、password和tel类型），就会有一个maxlength属性进行限制长度

<input type="text" placeholder="只能输入六个字符" maxlength="6">

tel类型的input在ios上会调出全数字键盘，而number类型的input则会调出带有标点符号的键盘。

2、限制输入内容：限制input输入为纯数字

• οnkeyup=“value=value.replace(/[\D]/g,’’)”

<input type="text" placeholder="只能输入数字"  onkeyup="value=value.replace(/[\D]/g,'')">

• οnchange=“value=value.replace(/[\D]/g,’’)”

<input type="text" placeholder="只能输入数字"  onchange="value=value.replace(/[\D]/g,'')">

onkeyup是在键盘抬起的时候触发，onchange是在input输入框失焦的时候触发，会发现虽然目的达到了，但是显示效果不太好。

• 更好的方法就是使用：οninput=“value=value.replace(/[\D]/g,’’)”

<input type="text" placeholder="只能输入数字"  oninput="value=value.replace(/[\D]/g,'')">