WEB端JQuery接入 扫码枪，填入表单内容

1. 页面有个输入框

2. 扫描枪要设置自动Enter，这个说明书上应该有的

3. 页面JQuery代码：

$(document).keydown(function(event) {
    var keyCode = event.keyCode;
    if(keyCode == "13"){
        var value = $("#elementId");
        //...TODO
    } 
});

4. 如何希望连续获得焦点可以设置$('#elementId').focus()，另外扫描时输入法要切换到英文的状态下
————————————————
版权声明：本文为CSDN博主「小鹿_2015」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/jys1109/article/details/10066957

vue项目中扫码枪收款 

 

扫码枪会将扫到的数据带入到获取焦点的输入框中，并且触发输入框的enter回车事件

1.自动获取焦点

 
// 使用directives注册v-focus全局指令
  directives: {
    focus: {
      inserted: function(el) {
        el.querySelector("input").focus();
      }
    }
  },

2.监听回车事件

payCode(){

　　//这里进行扫码后的操作

}

 

转载于:https://www.cnblogs.com/samsara-yx/p/11540394.html

 

/**
 * 点击处方外流
 */
 handleDrain () {
      this.rowData = []
      this.showInlineDialog = true
      clearInterval(this.loopTimer)
      this.loopTimer = null
      // 时时聚焦
      this.loopTimer = setInterval(() => {
        this.$nextTick(() => {
          // 扫码聚焦
          this.$refs['sm_input'].focus()
        })
      }, 300)
    },
/**
 * 扫码输入中
 */
    inputSaoMa (val) {
      // setTimeout定时器的作用是，等待扫码枪输入完，拿到完整的二维码信息，再调接口（扫码枪输入速度大概8~20毫秒，手动输速度大概是80毫秒），否则拿不到完整的二维信息。
      if (val === '') return false
      this.isShow = false
      clearTimeout(this.endTimeout)
      this.endTimeout = null
      this.endTimeout = setTimeout(() => {
        if (this.qrcode === val) {
          clearTimeout(this.endTimeout)
          console.log('输入完毕')
          this.isShow = true
          this.isReadOnly = true
          // 用二维码信息去请求数据
          this.decode({ code: val })
        }
      }, 500)
    },

/**
 * 解码接口
 */
    async decode (data) {
      const res = await decode(data)
      this.qrcode = ''
      if (res.code !== 200) {
        this.$message.error('二维码解析错误，请核对后重新扫码')
      } else {
        if (this.rowData.length > 0) {
          // 判断去重
          let isReuse = false
          this.rowData.map(item => {
            // 交替判断是否存在相同字符串（多次扫码二维码处理）
            let str = item.rawData
            let str2 = res.data.rawData
            if (str.indexOf(str2) != -1) {
              isReuse = true
              return false
            }
            if (str2.indexOf(str) != -1) {
              isReuse = true
              return false
            }
          })
          console.log(isReuse)
          if (!isReuse) {
            this.rowData.push(res.data)
          } else {
            this.$message.warning('该处方单已存在')
          }
        } else {
          this.rowData.push(res.data)
        }
      }
    },

 

WEB端接入   扫码枪 

常用场景：

 参加活动时 身份查询，活动资格查询；

html页面

这样用JQuery对扫描枪的扫描监控，实现了表单自动填充与提交

喜欢的点桃心，喜欢一下~

作者：丢了发型的男人
链接：https://www.jianshu.com/p/98bf9e972db2
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。