如果您在移动设备上打开此链接,则事件不会触发;如果在桌面上打开,则会触发。请问如何解决这个问题?有人可以帮帮我吗?谢谢!
目前,Chrome移动版无法正确支持keypress事件。这是一个长期存在的错误:
https://code.google.com/p/chromium/issues/detail?id=118639
我认为它应该在v38中得到修复。但是该错误报告已被关闭,标记为“不会修复”。
看起来keypress
事件已被弃用(请参考https://developer.mozilla.org/en-US/docs/Web/Events/keypress),现在最好使用keydown
事件,在所有浏览器都停止支持之前。
我建议在输入框上添加两个事件。
这将适用于桌面Web浏览器。
1)onkeypress = return isNumberKey(event);
function isNumberKey(e)
{
var evt = e || window.event;
if(evt)
{
var charCode = evt.keyCode || evt.which;
}
else
{
return true;
}
if((charCode > 47 && charCode < 58) || charCode == 9 || charCode == 8 || charCode ==46 || charCode ==37 || charCode==39)
{
return true;
}
return false;
}
这将适用于移动设备
2) onkeyup="numberMobile(event);"
function numberMobile(e){
e.target.value = e.target.value.replace(/[^\d]/g,'');
return false;
}
在输入框上应用两个事件,它就会起作用。唯一的缺点是它会使其变慢。但目前我们必须忍受它。
这个解决方案存在一个问题,左侧导航不起作用。我会尽快更新更合适的解决方案。
最后我找到了一个问题,但它在Opera浏览器中不起作用。与其编写数字字段的代码,我只需在html文件中将属性type='number'添加到输入字段中即可。现在只有数字键盘出现了。因此,它满足我的要求。这是JsFiddle
HTML代码:
<input type='number'/>
jsFiddle
,它在我的回答中提到了。 - user3279058//"beforeinput #search_input":"typeOfField"
。如果我理解有误,请纠正我。 - aravindtype='number'
,你就不需要编写任何额外的代码。这就是我隐藏的原因。 - user3279058<input type="number">
<input type="text">
<input type="tel">
<input type="number">
<input type="text">
<input type="tel">
let caretPos = e.target.selectionStart
请问有没有办法检测中光标的位置。
建议
对于桌面浏览器,使用 input[type="text"] 来处理像按键事件这样的情况,并使用光标位置替换一些值。
对于 Android 浏览器,使用 input[type="tel"] 来处理上述相同的情况。
在 BrowserStack 上进行了测试。对我来说似乎很正常。 这是您的代码片段链接:
请告诉我您在测试的具体安卓设备和浏览器。
摩托罗拉 Motog
手机和浏览器 Google Chrome
。 - user3279058
Motorola Moto G
手机。 - user3279058keypress
事件。使用input
事件,它更可靠。 - aravindkeycode
没有起作用。你能检查一下这个链接http://jsfiddle.net/33Snz/14/
吗?我得到了undefined
。 - user3279058https://dev59.com/WX3aa4cB1Zd3GeqPhsWp
。 - user3279058