js获取USB扫码枪数据的方法

本文实例为大家分享了js获取USB扫码枪数据的具体过程，供大家参考，具体内容如下

废话不多说，直接上代码，这个方法避免了 首字缺失，字符串乱码等等问题，特别好用，记录一下

中间的Ajax可直接调用登录功能，实现自动登录

说明：输入框需要获得焦点，这个是必须的，其次为了防止回车触发手动登录，需要添加οnkeypress="if(event.keyCode==13) return false;"这个操作，这个在回车的时候，输入框焦点不会丢失，除非手动切换焦点，或者调用focus();方法

<div class="form-group">
 <label for="inputUsernameEmail">账号</label>
 <input type="text" placeholder="请输入账号" name="username" id="loginname" class="form-control" autofocus onkeypress="if(event.keyCode==13) return false;">
</div>

代码：

<script>
  window.onload = (e)=> {
   this.start = new Date().getTime()
   let code = ''
   let lastTime, nextTime
   let lastCode, nextCode
   let that = this
   window.document.onkeypress = function (e) {
    if (window.event) { // IE
     nextCode = e.keyCode
    } else if (e.which) { // Netscape/Firefox/Opera
     nextCode = e.which
    }
    console.log('nextCode', nextCode)
    if (e.which === 13 || window.event === 13) {
     var deviceCode = code;
     console.log(code)
     console.log('扫码结束')
     console.timeEnd()
     code = ''
     lastCode = ''
     lastTime = ''
     $.ajax({
      cache: true,
      type: "POST",
      url: rootPath + "/admin/login",
      data: {code: deviceCode, type: 1},
      async: false,
      error: function (request) {
       $("#loginname").val("");
       $.modal.alertError("系统错误");
      },
      success: function (data) {
       $("#loginname").val("");
       if (data.code == 200) {
        location.href = rootPath + '/admin/index';
       } else {
        $.modal.alertError(data.msg);
       }
      }
     });
    }
    nextTime = new Date().getTime()
    if (!lastTime && !lastCode) {
     console.log('扫码开始。。。')
     code += e.key
    }
    if (lastCode && lastTime && nextTime - lastTime > 500) { // 当扫码前有keypress事件时,防止首字缺失
     console.log('防止首字缺失。。。')
     code = e.key
    } else if (lastCode && lastTime) {
     console.log('扫码中。。。')
     code += e.key
    }
    lastCode = nextCode
    lastTime = nextTime
   }
  }
</script>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • JS实现扫码枪扫描二维码功能

    扫码枪扫描二维码,具体内容如下所示: 业务需求要将数据生成二维码,并用扫码枪扫出数据上传到服务端. 先上代码吧,之后再完善注意点 this.start = new Date().getTime() let code = '' let lastTime, nextTime let lastCode, nextCode let that = this window.document.onkeypress = function (e) { if (window.event) { // IE nextC

  • js 获取扫码枪输入数据的方法

    1.扫码枪相当于键盘输入设备,输入一连串数字后加一个enter键.但在实际开发中需要区分是扫描枪输入还是键盘用户输入,区别在于扫码枪输入很快. let code = ''; let lastTime, nextTime; let lastCode, nextCode; window.document.onkeypress = (e) => { if (window.event) { // IE nextCode = e.keyCode; } else if (e.which) { // Nets

  • 使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解

    下面通过实例代码给大家介绍js扫码枪扫描条形码的实现方法,具体代码如下所示: var keycode = ""; var lastTime=null,nextTime; var lastCode=null,nextCode; document.οnkeydοwn=function(e){ if(window.event){ // IE nextCode = e.keyCode } else if(e.which){ // Netscape/Firefox/Opera nextCode

  • js获取USB扫码枪数据的方法

    本文实例为大家分享了js获取USB扫码枪数据的具体过程,供大家参考,具体内容如下 废话不多说,直接上代码,这个方法避免了 首字缺失,字符串乱码等等问题,特别好用,记录一下 中间的Ajax可直接调用登录功能,实现自动登录 说明:输入框需要获得焦点,这个是必须的,其次为了防止回车触发手动登录,需要添加οnkeypress="if(event.keyCode==13) return false;"这个操作,这个在回车的时候,输入框焦点不会丢失,除非手动切换焦点,或者调用focus();方法

  • js遍历获取表格内数据的方法(必看)

    本文将介绍如何使用js获取表格内某一单元格的内容,表格由table,tr,td等html标记组成.table表示表格,tr表示行,td表示行中列. 1.一般的表格结构如下 <table> <tr> <td>id</td> <td>name</td> </tr> <tr> <td>1</td> <td>fdipzone</td> </tr> <tr

  • Node.JS获取GET,POST数据之queryString模块使用方法详解

    无论是前端还是后端,经常出现的应用场景是URL中参数的处理.nodeJS的queryString模块提供了一些处理 query strings 的工具.本文将详细介绍nodeJS中的queryString var querystring = require('querystring'); /* { unescapeBuffer: [Function], unescape: [Function: qsUnescape], escape: [Function], encode: [Function]

  • JS获取年月日时分秒的方法分析

    本文实例分析了JS获取年月日时分秒的方法.分享给大家供大家参考,具体如下: var d = new Date(); var time = d.getFullYear() + "-" +(d.getMonth()+1) + "-" + d.getDate() + " " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds(); 必须这么繁杂,没

  • js获取图片宽高的方法

    js获取图片宽高的方法

    本文分享多种js获取图片宽高的方法,并且通过实例进行分析,希望大家从中有所收获. 一.简陋的获取图片方式 // 图片地址 后面加时间戳是为了避免缓存 var img_url = 'upload/2013/13643608813441.jpg?'+Date.parse(new Date()); // 创建对象 var img = new Image(); // 改变图片的src img.src = img_url; // 打印 alert('width:'+img.width+',height:'

  • jQuery插件zTree实现获取一级节点数据的方法

    jQuery插件zTree实现获取一级节点数据的方法

    本文实例讲述了jQuery插件zTree实现获取一级节点数据的方法.分享给大家供大家参考,具体如下: 1.实现代码: <!DOCTYPE html> <html> <head> <title>zTree实现基本树</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel=&qu

  • JS获取本地地址及天气的方法实例小结

    本文实例讲述了JS获取本地地址及天气的方法.分享给大家供大家参考,具体如下: 一.获取本地的地址 第一种方式: 1.利用浏览器获取当前位置的经纬度 window.onload=getCurrentPosition; //浏览器获取当前位置 function getCurrentPosition() { if (window.navigator.geolocation) { var options = { enableHighAccuracy: true, }; window.navigator.

  • 四种数据库随机获取10条数据的方法

    四种数据库随机获取10条数据的方法 SQL Server: 复制代码 代码如下: SELECT TOP 10 * FROM T_USER ORDER BY NEWID() ORACLE: 复制代码 代码如下: SELECT * FROM (SELECT * FROM T_USER ORDER BY DBMS_RANDOM.RANDOM()) WHERE RONUM <= 10 MySQL: 复制代码 代码如下: SELECT * FROM T_USER  ORDER BY  RAND() LIM

  • js获取内联样式的方法

    本文实例讲述了js获取内联样式的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,in

  • Repeater中添加按钮实现点击按钮获取某一行数据的方法

    Repeater中添加按钮实现点击按钮获取某一行数据的方法

    本文以一个asp.net程序为例讲述了Repeater中添加按钮实现点击按钮获取某一行数据的方法,分享给大家供大家参考借鉴之用.具体步骤如下: 1.添加编辑按钮和删除按钮 具体代码如下: <asp:Repeater ID="Repeater1" runat="server" onitemcommand="Repeater1_ItemCommand"> <ItemTemplate> <table width="

随机推荐