JS使用扫码枪传递参数调取后端接口

妖狐艹你老母 2023-01-13 06:19 263阅读 0赞

项目需求：使用条码枪进行商品编码扫描并录入商品信息

方法一：

<input type="text">
    <script type="text/javascript">
        var a = [];
        var timeout;
        $("input").keyup(function(){
            a.push($(this).val());
            clearTimeout(timeout);
            timeout = setTimeout(function(){
                var b = a.pop();
                $.ajax({
                    url:'',
                    type:"",
                    data:{},
                    jsonType:"json",
                    success:function(){},
                    error:function(){}
                });
            },1000);
        });
    
        //input自动聚焦
        $(document).ready(function(){
            $("input").focus();
        });
        $(function () {
            $('input').blur(function () {
                var that = this; //或者用闭包
                setTimeout(function () { $(that).focus(); },100); }); });
        $('input').blur(function() {$(this).focus();
        });

方法二：

<script type="text/javascript">
        layui.use(['form','layer','laydate','element'],function() {
            var form = layui.form,
                $ = layui.jquery,
                laydate = layui.laydate,
                element = layui.element;
            //1. 在页面初始化的时候调用一下代码
            initScannerModule();
            //input自动永久聚焦
            $(document).ready(function(){
                $("input").focus();
            });
            $("input").blur(function () {
                $(this).focus();
            });
    
            //扫码传递参数解析接口
            //页面初始化
            function initScannerModule(){
                var code = "";
                var lastTime,nextTime;
                var lastCode,nextCode;
    
                document.onkeypress = function(e) {
                    nextCode = e.which;
                    if(e.which === 13){
                    //手动输入的时间不会让code的长度大于2，所以这里只会对扫码枪有效
                        if(code.length < 2){ 
                            return
                        }
                        lastTime = null;
                        lastCode = null;
                        code = '';
                        return;
                    }
                    nextTime = new Date().getTime();
               
                    if(lastCode != null && lastTime != null && nextTime - lastTime <= 30) {
                        code += String.fromCharCode(lastCode);
                    } else if(lastCode != null && lastTime != null && nextTime - lastTime > 100){
                        code = "";
                    }
    
                    lastCode = nextCode;
                    lastTime = nextTime;
                };
    
                this.onkeypress = function(e){
                    if(e.which == 13){
                        //2.获取到条形码 code
                        //console.log(code);
                        //3.根据条形码处理相关业务
                        $.ajax({
                            url: '', //请求的url地址
                            dataType:"json",//返回格式为json
                            async:true,//请求是否异步，默认为异步，这也是ajax重要特性
                            data:{},//参数值
                            type:"",//请求方式
                            success:function(data){},
                        });
                        code = "";
                    }
                }
            }
    
        })
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，263人围观）

还没有评论，来说两句吧...

相关阅读

相关 uni-app扫码调起客户端扫码界面，扫码成功后返回对应的结果。

<template> <view @click="scanCode"> 点击获取扫码二维码后获取二维码的内容 </view> <

快来打我*/ 2023年06月12日 09:15/ 0 赞/ 73 阅读

相关 JS使用扫码枪传递参数调取后端接口

项目需求：使用条码枪进行商品编码扫描并录入商品信息方法一： <input type="text"> <script type="text/javascri

妖狐艹你老母/ 2023年01月13日 06:19/ 0 赞/ 264 阅读

相关 JS 中实现扫码枪使用 [JavaScript,jQuery,一维扫码]

![20200922191651247.gif][] 前言：首先是条码扫描头在设备管理器中可以看到就是一个键盘设备。然后屏幕也是个光源，扫描枪不能扫屏幕，条码

女爷i/ 2022年12月09日 14:00/ 0 赞/ 1121 阅读

相关 js 传递参数中文乱码

换成这种方式接收 function getQueryString(key){ var reg = new RegExp("(^|&)"+key+"=

淩亂°似流年/ 2022年10月15日 09:55/ 0 赞/ 244 阅读

相关 js setTimeout 参数传递使用

setTimeout的参数传递问题想必大家有所纠结，window.settimeout()方法要调用带参数的函数有两种方法，下面为大家详细介绍下，感兴趣的朋友可以参考下

深碍√TFBOYSˉ_/ 2022年06月17日 06:40/ 0 赞/ 197 阅读

相关 axios 使用post方式传递参数，后端接受不到

最近做vue项目，做图片上传的功能，使用get给后台发送数据，后台能收到，使用post给后台发送图片信息的时候， [vue axios post请求发送图片base64编码

Myth丶恋晨/ 2022年05月15日 06:42/ 0 赞/ 386 阅读

相关 MyBatis 使用Map接口传递参数

示例【MyBatis 使用Map接口传递参数】创建UserMapper.xml <?xml version="1.0" encoding="UTF-8"?>

雨点打透心脏的1/2处/ 2022年05月15日 00:45/ 0 赞/ 241 阅读

相关原生JS调取PC端摄像头源码记录

今天简单的记录一个JS调取摄像头的源码，不是很难，只是为了以后可以直接拿来使用，好的废话不多说，看源码！ <!doctype html> <html lang

心已赠人/ 2022年02月26日 13:14/ 0 赞/ 207 阅读

相关 axios 使用data方式传递参数，后端接受不到

最近做vue项目，做图片上传的功能，使用get给后台发送数据，后台能收到，使用post给后台发送图片信息的时候， [vue axios post请求发送图片base64编码

墨蓝/ 2021年07月26日 21:26/ 0 赞/ 768 阅读

相关 JS 如何获取扫码枪输入数据

JS 如何获取扫码枪输入数据 1、扫码枪相当于键盘输入设备，输入一连串数字后加一个enter键。但在实际开发中需要区分是扫描枪输入还是键盘用户输入，区别在于扫码枪输入很快。

朱雀/ 2020年07月01日 16:06/ 0 赞/ 719 阅读