javascript扫码枪的判断输入

最新推荐文章于 2025-07-10 17:24:29 发布
原创 最新推荐文章于 2025-07-10 17:24:29 发布 · 2.1w 阅读 · 14 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #扫码枪

设计思路：

扫码枪本质上来讲是一种输入设备，和键盘没有任何区别，因此如何实现对扫码枪的判断是一个难点。

另外一个难点在于如何在不使用文本框监听的情况下实现对扫码枪的监听与输入。

关于以上两点，首先，可以通过判断输入时间间隔来判断究竟是扫码枪还是键盘，经过我的实测，扫码枪输入的时间间隔一般在8毫秒，偶尔会有16毫秒，而键盘输入一般都在80毫秒以上，因此我设定当输入间隔小于等于30毫秒时，判断为扫码枪输入；其次，可以通过对document的onKeyPress事件进行监听判断输入，至于为何要使用onKeyPress事件而不是onKeyDown或者onKeyUp进行监听，是因为只有通过onKeyPress事件监听按键才能准确的还原键盘码，这一点我在chrome已经实测过了。

<%
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
  <head>
    <script type="text/javascript" src="<%=basePath%>/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
    	window.onload = function(e) {
    		var codeString = "";
    		var lastTime;
    		document.onKeyPress = function(e) {
    			var code = e.which;
    			var nextTime = new Date().getTime();
    		
    			if(nextTime - lastTime <= 30) {
    				codeString += String.fromCharCode(code);
    			}
    			lastTime
最低0.47元/天 解锁文章

200万优质内容无限畅学
js 获取扫码枪输入数据的方法
10-15
主要介绍了js 获取扫码枪输入数据的方法，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
使用jQuery监听扫码枪输入并禁止手动输入的实现方法(推荐)
12-10
基于jQuery的扫码枪监听。如果只是想实现监听获取条码扫码信息，可以直接拿来使用，如果有更多的条码判断处理逻辑需要自己扩展。 一、功能需求 使用扫码枪扫描条码，在一个web页面监听获取扫码枪的数据，并禁止用户进行手动的输入操作。 开始的想法非常简单，因为扫码枪就是模拟键盘的输入，当他用usb接口插入电脑的时候，就变成了一个外接的输入设备，用js监听就可以了。但是如何判断用户是否为手动输入就需要做一些处理了。 二、主要问题 1.如何判断是否手动输入 2.如何判断一个条码输入完成 三、解决方案 手动输入的解决办法就是：对比一个键从按下到抬起的时间间隔，以及两次按键的时间间隔。 因为扫码枪的输入速
html页面如何监听获取扫码枪的数据？
最新发布
liang_dongdong的专栏
07-10 388
最近在做与硬件交互的项目，其中一个是扫码枪 我们的需要是html 页面接收扫描枪数据 并且获取到用户数据；首先我们得知道扫码枪是如何把数据扫到文本里的？扫码枪能将数据 “录入” 文本框，核心是。
实现JavaScript与光标扫码枪的无缝集成
weixin_42608299的博客
06-10 959
简介：本文详细解析了如何将JavaScript与光标扫码枪集成，以提高网页应用的数据录入效率和准确性。包括处理键盘事件、防止鼠标和键盘误操作、处理大写锁定、规避中文输入法冲突以及隐藏光标以优化用户体验等方面。文章还分析了关键文件的功能，包括页面结构引用、jQuery库的使用和核心扫码功能的实现。
vue input判断值是扫码枪还是键盘输入
weixin_42479305的博客
08-25 3813
区分扫描枪输入和键盘输入的实现 首先，在input上绑定keyup事件，注意添加native 如图： <el-input class=“clo_input mgtop_20” v-model=“WashingCode” @keyup.native=“inputNum” @change=“inputchange”> methods中inputNum方法如下： 新增一个新数组，每次得到的target.timeStamp,是指 当前按键发生时间，而计算前后按键发生时间间隔，超过30一般是指按键，
js 扫码枪的输入
weixin_30593443的博客
07-18 378
关于js 获取扫码枪的输入获取方式，之前在网上搜了好多，都是大同小异的，都是说扫码枪输入的时间间隔不会超过30毫秒。但事实上我拿了几台电脑测试的结果是，有的时间间隔甚至超过了100毫秒，所以用时间间隔去判断是人工输入还是扫码枪输入，感觉还是不怎么理想，所以我换了一种逻辑去实现获取扫码枪的输入，代码如下： scanCode() { let code = '' ...
在js中判断是扫码枪还是手动输入
weixin_50391597的博客
06-29 2918
通过判断第一次按键的时间与按回车之后的时间进行比较 如果相隔大于30,说明是手动输入的(扫码枪的扫码时间一般不会大于30) //输入框内键盘第一次按下的时候开始记录时间 keydown-->按下的过程 $("#输入框id").keydown(function(event){ var twoTime, oneTime; //keypree 键盘每按下一次进入一次 $(this).keypress (.
JS如何获取扫描枪扫描的条形码
jifengdalu的博客
10-12 1万+
//页面初始化 $.function({ //1. 在页面初始化的时候调用一下代码； initScannerModule(); }) function initScannerModule(){ var code = ""; var lastTime,nextTime; var lastCode,nextCode; docum...
JS判断是键盘输入还是扫码枪输入
chwlallen的专栏
03-13 4034
JS实现扫码枪输入
Javascript判断扫码枪的输入，以及扫码后提交表单数据
weixin_30776545的博客
09-05 2289
条码扫描器其实就是一种输入设备，跟键盘一样。在控制台打印扫描过程，可以看出，扫描过程就像是在键盘上敲击相应的键，keycode和键盘是一一对应的，只是输入速度(间隔时间)比物理键盘输入要快得多。我们可以通过监听输入间隔时间，来判断到底是键盘输入还是扫描输入。 扫码枪输入的时间间隔一般在10毫秒以内，物理键盘输入要远大于这个数值，通常为80毫秒以上。因此，当输入间隔时间小于30毫...
判断扫描枪还是键盘输入
05-26
判断扫描枪还是键盘输入
JS实现扫码枪扫描二维码功能
10-15
在JavaScript中实现扫码枪扫描二维码的功能，主要是通过监听键盘事件来模拟扫码过程，因为扫码枪在扫描二维码后，会将二维码中的数据模拟成连续的键盘输入。以下将详细讲解实现这个功能的关键步骤和注意事项。 首先...
2021-11-01
weixin_52630327的博客
11-01 461
判断是否为扫码枪输入，以及监听扫码枪 扫码枪简单点说就是键盘输入事件，但是输入的很快，最后加上回车事件。先上代码 let that = this//将this赋值给一个变量，document里面this存在指向问题 //当前页面监视键盘输入 模拟扫描枪完整录入事件 document.onkeydown = function (e) { //事件对象兼容 let e1 = e || event || window.event || argumen
原生js扫码枪扫描输入监听
a513436535的博客
08-17 2602
原生js扫码枪扫描输入监听
js 监听扫描枪输入事件
xinkailei3的博客
07-30 1万+
扫码枪本质上来讲是一种输入设备，和键盘没有任何区别，因此如何实现对扫码枪的判断是一个难点。 另外一个难点在于如何在不使用文本框监听的情况下实现对扫码枪的监听与输入。 关于以上两点，首先，可以通过判断输入时间间隔来判断究竟是扫码枪还是键盘，经过我的实测，扫码枪输入的时间间隔一般在8毫秒，偶尔会有16毫秒，而键盘输入一般都在80毫秒以上，因此我设定当输入间隔小于等于30毫秒时，判断为扫码枪输入。 /...
js获取USB扫码枪数据
热门推荐
MG516的博客
08-22 1万+
前言 找了很多相关的教程不太好用，汲取各家之长总结精简了一下 原理 扫码枪扫描到的条形码每一位会触发一次onkeydown事件 比如扫描条码位‘1234567890’的条形码，会连续执行10次onkeydown事件 条码扫描到最后一位，会直接触发Enter 代码 需要引入jQuery，我这里用的是vue框架，使用可按需修改方法that.data部分 window.onlo...
JS解析扫码枪
化名三爷
04-11 1364
废话不多说，直接上代码，这个方法避免了首字缺失，字符串乱码等等问题，特别好用，记录一下 <script> window.onload = (e)=> { this.start = new Date().getTime() let code = '' let lastTime, nextTime let lastCode, nextCode ...
js 扫码枪输入数据 累加
07-23
### 回答1： 使用JavaScript编写扫码枪输入数据累加的代码非常简单。我们可以通过监听输入事件来获取扫码枪输入数据，并在每次输入时将数据累加到一起。 首先，需要在HTML文件中创建一个文本框和一个显示累加结果的元素，如下所示： ```html <input type="text" id="input" /> <p id="result"></p> ``` 然后，在JavaScript代码中获取输入框和结果显示元素的引用，并添加一个输入事件监听器： ```javascript const input = document.getElementById('input'); const result = document.getElementById('result'); let sum = 0; input.addEventListener('input', function(event) { const value = parseInt(event.target.value); if (!isNaN(value)) { sum += value; result.textContent = '累加结果：' + sum; } }); ``` 这段代码首先定义了一个变量`sum`来保存累加结果的值，并设置初始值为0。然后，使用`addEventListener`方法添加了一个输入事件监听器，在每次输入事件发生时调用匿名函数。 在匿名函数中，首先通过`event.target.value`获取输入的值，并使用`parseInt`将其转换为整数类型。然后，检查转换后的值是否为有效的数字，若是，将其累加到`sum`中，并更新结果显示元素的文本内容。 最后，将JavaScript代码放置在HTML文件的`<script></script>`标签中，或者将其保存为一个单独的`.js`文件并通过`<script src="script.js"></script>`的方式引入。 这样，当用户使用扫码枪输入数据时，累加结果会实时显示在页面上。 ### 回答2： 在JavaScript中，可以通过监听扫码枪的输入事件来获取扫码枪输入的数据，并进行累加操作。下面是一个简单的示例代码： ```javascript // 假设页面上有一个用于显示累加结果的文本框 var resultInput = document.getElementById('result'); // 初始化累加结果为0 var sum = 0; // 监听扫码枪的输入事件 document.addEventListener('keydown', function(event) { // 获取键盘按下的字符 var char = String.fromCharCode(event.keyCode); // 判断是否为数字 if (/^\d$/.test(char)) { // 将输入的数字累加到结果上 sum += parseInt(char); // 更新文本框的值 resultInput.value = sum; } }); ``` 在上述代码中，我们通过addEventListener方法监听了keydown事件，当有键盘按键被按下时触发该事件。然后判断按下的键是否为数字，并将数字累加到sum变量中。最后更新显示累加结果的文本框的值。 这样，当你使用扫码枪输入数字时，脚本会将输入的数字累加起来，并实时更新在页面上。 ### 回答3： 使用JavaScript编写代码来实现扫码枪输入数据的累加非常简单。下面是一个示例代码： ```javascript // 初始化累加器 let sum = 0; // 监听扫码枪输入事件 document.addEventListener('keydown', function(event) { // 检查输入的键值是否为数字键 if (event.key >= '0' && event.key <= '9') { // 将输入的数字转换为整数，并累加到总和上 sum += parseInt(event.key); } }); // 输出累加结果 console.log('当前累加结果为:', sum); ``` 上述代码通过使用`document`对象的`addEventListener`方法来监听键盘按下事件，然后检查输入的键值是否为数字键。如果是数字键，则将输入的数字转换为整数，并累加到`sum`变量上。最后，通过`console.log`方法输出累加结果。 你可以将上述代码放在HTML文件中的`<script>`标签内，并在浏览器中运行该文件。然后，当你使用扫码枪扫描条形码时，输入的数字将被累加到`sum`变量上，并在控制台上显示累加结果。
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值