javascript - 只允许输入字段 IOS 中的数字

Question

好吧好吧。我想限制输入字段只接受最大长度为 5 个字符的数字。

我的尝试:

HTML

 <input type="number" maxlength="5" onKeyDown="numbersOnly(event);/>
 <input type="text" pattern= "[0-9]" onKeyDown="numbersOnly(event);/>

Javascript

   function numbersOnly(event,length) 
   {  
    return event.ctrlKey || event.altKey 
    || (95<event.keyCode && event.keyCode<106)
    || (event.keyCode==8) || (event.keyCode==9) 
    || (event.keyCode>34 && event.keyCode<40) 
    || (event.keyCode==46)
    || (event.keyCode>47)&&(event.keyCode<=57) ;
   }

所有在 firefox 中工作。但是当我检查 safari ipad 时，它接受像 ()@!#$& 这样的特殊字符。我使用警报功能进行调试。它为 @ 和 2 、 3 和 # 等返回相同的 keyCode。我尝试了 keyUp、keyPress 事件和 event.charCode、event.which、event.key。什么都行不通

那么如何区分它，我还需要支持退格键、回车键、删除键和箭头键。

Answer 1

我已经做了一次，但没能打破它。在 iPad 上测试。

// Prevent NULL input and replace text.
$(document).on('change', 'input[type="number"]', function (event) {
    this.value = this.value.replace(/[^0-9]+/g, '');
    if (this.value < 1) this.value = 0;
});

// Block non-numeric chars.
$(document).on('keypress', 'input[type="number"]', function (event) {
    return (((event.which > 47) && (event.which < 58)) || (event.which == 13));
});

这也说明了人们经常忘记的复制/粘贴和拖放文本。您可以将最大长度添加到 onchange。