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

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

方法一:

<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
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值