JQuery获取扫描枪扫描的数据

1)、首先我们得知道扫描枪的性质跟键盘是一样的,都是输入设备(可以等价理解为扫描枪就是键盘)。然后每次扫描完都会自动输入一个回车按钮。例如我们扫描一个条形码(中国商品的条形码上的数值都是13位的),相当于是我们在键盘上按了13下键盘按键。

2)、得知我们扫描枪的性质就是一个键盘,那我们就可以通过键盘的监听事件来监听扫描仪键入的按钮是哪一些(注意,监听到的数据是一个ASCII码,需要转换下)。

3)、上代码:(下面的代码监听的是全局的输入情况,不管你有没有获得输入框的焦点都可以监听的到,当然你也可以对一个输入框绑定该监听事件,稍微修改下代码即可)

<script>
    var char = "";    //记录扫描枪输入的内容
    var lastTime=null;//上次输入的时间
    var nextTime=null;//这次输入的时间
    var lastCode=null;//上次输入的键值(接收到的为ASCII值)
    var nextCode=null;//这次输入的键值(接收到的为ASCII值)
    $(document).keydown(function(event){
            nextTime = new Date().getTime();//获取当前键入的时间
            //判断是否输入了回车按钮,并确认是扫描枪键入的值
            if (event.keyCode === 13 && char !== "" && nextTime - lastTime <= 30){
                //把监听到的数据显示在我的文本框上
                $("input[name='good_id']").val(char);
                //清空数值,以便下一次扫描
                char = "";
                lastCode = null;
                lastTime = null;
            }else {
                //获取键入的键值
                nextCode = event.keyCode;
                //如果是第一个字母你可以进行一些代码增强,我这里并没有处理,直接转换了
                if(lastCode == null && lastTime == null){
                    //初始字母
                    char = String.fromCharCode(nextCode);
                    //写入你要增强的代码。。。
                    
                    //判断是否是扫描枪键入的值
                }else if(lastCode != null&&lastTime!= null && nextTime - lastTime <= 30){
                    //键入的值为ASCII码,要获取对应得值,需要转换一下
                    char += String.fromCharCode(nextCode);//存到char中,拼接上次的结果
                } else{
                    //判断为手动输入,不做任何处理,数据保持为null即可
                    // alert("suck");
                    char = "";
                    lastTime=null;
                    nextTime=null;
                    lastCode=null;
                    nextCode=null;
                }
                //lastCode、lastTime为中间变量,存储数据,让nextCode与nextTime可以存新数据
                //nextCode与nextTime要存储新键入按钮的信息
                lastCode = nextCode;
                lastTime = nextTime;
            }
</script>

总之大体上就这个样子了,参考了这位老哥的文章https://www.jianshu.com/p/3019858e3cad

而且有一个问题我自己也不知道怎么解决,(我用的是AdminLTE的前端框架)那就是在input文本框获得焦点时扫描得到的是一堆乱码(估计跟我框架有关系),意思就是我在input文本框中键入一个字母a,跟没有获得焦点在全局的情况下键入一个字母a,它们通过代码监听到的ASCII码值是不一样的,这个问题我没解决,我也不知道怎么解决。我直接禁用input输入框了采用js代码为input框赋值,然后再加一个开关用于·开启 “手动输入”

  • 2
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
jQuery中,可以使用ajax方法来获取数据。ajax方法是通过发送HTTP请求与服务器进行通信,并在请求成功后获取返回的数据。具体的代码如下所示: ```javascript $.ajax({ url: "请求地址", type: "GET", // 请求类型,可以是GET或POST dataType: "json", // 返回的数据类型,可以是json、xml、html等 success: function(data) { // 请求成功后的回调函数,data为返回的数据 // 在这里可以对返回的数据进行处理 console.log(data); }, error: function(xhr, status, error) { // 请求失败后的回调函数 console.log(error); } }); ``` 在上述代码中,url表示请求的地址,type表示请求的类型,dataType表示返回的数据类型。在success回调函数中,可以对返回的数据进行处理。如果请求失败,可以在error回调函数中进行错误处理。 #### 引用[.reference_title] - *1* [JQuery从服务器获取数据](https://blog.csdn.net/dreamwbt/article/details/78353913)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [学习jQuery框架获取数据的几种基础方式](https://blog.csdn.net/weixin_44540178/article/details/89083033)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [JQuery基本获取值的方式](https://blog.csdn.net/weixin_59668801/article/details/126416426)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值