移动端 扫描枪输入不弹出键盘
目前有一个需求,用户可以手写输入 也可以 扫描枪输入,使用安卓的一个机器,进行扫描二维码 读取内容 并查找展示
扫描枪原理:模拟移动端输入键盘,从而将获取的内容赋值在获取焦点的input上 (扫到东西的话会自动在焦点处输出)
因为是模拟输入键盘 实际上 扫描枪输入完成以后,会自动吊起移动端小键盘,现在就如何在扫描的时候 不掉起小键盘 ,只进行赋值。
解决方法:
1.利用input readonly属性
试验了一下,当input有readonly属性的时候,即使获取焦点,也不会吊起小键盘
利用这个特性,在获取到内容以后,给input添加readonly属性,使得小键盘不出现,进行操作以后 再讲属性移除,这样既获取了焦点,又没有吊起小键盘,之后还可以进行扫码操作
if($(this).val().trim().length>0){ 获取到内容以后,给input添加readonly属性 input.attr('readonly',true) time1=setTimeout(function() { $.ajax({ type: "POST", url: "/yili/signin/byqrcode", beforeSend:function(){ clearTimeout(time1); }, data: “”, success: function (data) { }, complete: function () { 查询结束后,给input移除readonly属性,此时焦点依然在Input上,可以直接进行下一次操作 input.attr('readonly',false) }, error: function () { console.log("提交失败!"); } }); }, 1000) }
其他普及:
扫码枪输入的间隔大概在15-60毫秒,然后手动输入的100-200毫秒之间
input输入事件,包括 keydown 键盘(刚刚)按下,keypress 键盘(已经)按下,keyup 键盘抬起,
keydown,在按键刚刚被按下,但值还没有写入input
keypress 已经按下并且值已经输入到文本框
keyup 就是键盘弹起 可以利用keyup来判断input输入的内容,因为已经是输入完成
初始化获取焦点 而又不掉起键盘 可以为input添加 autofocus 属性 ,页面初始化的时候执行 ,只执行一次