实现原理：将Object标签以字符串的形式添加到页面的body中，通过attachEvent方式为AxtiveX添加响应事件，采用延迟读取缓存串口信息完成串口通信，利用执行回调函数完成参数与页面的参数传递与响应。以下是具体实现过程：
mscomm.js文件内容：
// JavaScript Document
function createMSComm(callBackFunction) {
var mscomm_str = "<OBJECT id=MSComm1 CLASSID='clsid:648A5600-2C6E-101B-82B6-000000000014' codebase='MSCOMM32.OCX' type='application/x-oleobject' style='width:100px;height:30px' >"
+"<PARAM NAME='CommPort' VALUE='1'/> "
+"<PARAM NAME='DataBits' VALUE='8'/> "
+"<PARAM NAME='StopBits' VALUE='1'/>"
+"<PARAM NAME='BaudRate' VALUE='9600'/>"
+"<PARAM NAME='Settings' VALUE='9600,N,8,1'/>"
+"<PARAM NAME='RTSEnable' VALUE='1'/>"
+"<PARAM NAME='DTREnable' VALUE='1'/>"
+"<PARAM NAME='Handshaking' VALUE='0'/>"
+"<PARAM NAME='NullDiscard' VALUE='0'/> "
+"<PARAM NAME='ParityReplace' VALUE='?'/>"
+"<PARAM NAME='EOFEnable' VALUE='0'/>"
+"<PARAM NAME='InputMode' VALUE='0'/>"
+"<PARAM NAME='InBufferSize' VALUE='1024'/>"
+"<PARAM NAME='InputLen' VALUE='1'/>"
+"<PARAM NAME='OutBufferSize' VALUE='512'/>"
+"<PARAM NAME='SThreshold' VALUE='0'/>"
+"<PARAM NAME='RThreshold' VALUE='1'/>"
+"</OBJECT>";
// 将OBJECT标签添加到body中
document.body.insertAdjacentHTML(' beforeEnd',mscomm_str);
// 打开串口
if(MSComm1.PortOpen==false){
try{
MSComm1.PortOpen=true;
}catch(ex){
alert("com1端口打开失败:"+ex.message);
}
}
// 串口响应事件
MSComm1.attachEvent("OnComm",function() {
switch(MSComm1.CommEvent){
case 2: //接收事件
if(mscomm_scan_value == "") {
mscomm_scan_value = MSComm1.Input;
// 定时读取缓存信息
setTimeout("getMSCommScanValue()",300);
}
break;
default: alert("Event Raised!"+MSComm1.CommEvent);
}
});
}
// 串口接收内容
var mscomm_scan_value = "";
// 读取缓存中剩余信息
function getMSCommScanValue(){
// 读取缓存中剩余的信息
while(MSComm1.inBufferCount > 0) {
mscomm_scan_value += MSComm1.Input;
}
// 执行页面传递过来的函数
callBackFunction(mscomm_scan_value);
// 清空当前读取信息
mscomm_scan_value = ""
}
test.html文件：
<html>
<head>
<title>JavaScript串口测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<script type="text/javascript" src="mscomm.js" >
</script>
<script type="text/javascript">
var i = 0;
function mscommCallBack(scanValue) {
var ewtm = document.getElementById("ewtm");
ewtm.innerHTML += "第" + (++i) + "次扫描：" + scanValue;
}
window.onload = function() {
createMSComm(mscommCallBack);
}
</script>
</head>
<body>
二维条码：
<div id="ewtm"></div>
</body>
</html>
分享到：
相关推荐
1. **事件驱动编程**：在Web应用程序中，键盘输入和扫描枪输入都是通过事件触发的。JavaScript是一种常用于处理这些事件的编程语言，它提供了`addEventListener`方法来监听和处理用户输入事件。 2. **键盘输入事件*...
在软件开发中，尤其是C#环境下开发扫描枪的应用时，需要关注的是如何有效地处理扫描枪触发的事件。这主要涉及到文本框的改变事件，具体包括： - **服务器端触发**：可以通过设置`OnTextChanged`属性来实现。当...
在本文中，我们将深入探讨如何使用JavaScript来获取扫码枪扫描的条形码数据。在电子商务、库存管理或其他需要快速输入条形码信息的场景中，利用JavaScript与扫码枪的交互能显著提高工作效率。以下是一份详细的步骤和...
在Web应用中集成扫描枪功能，可以让用户快速输入商品信息，提高工作效率。这个压缩包可能包含了一个JS库或API，使得网页可以监听扫描枪的数据，并将其转换为可处理的格式。 从"JS 串口"这个标签来看，开发者可能...
为了使扫描枪能够与网页交互，通常需要使用JavaScript或者WebUSB API等技术来建立通信接口。开发者需要编写代码，使得当扫描枪读取到条码时，网页能实时接收到并解析这些数据。同时，为了提供良好的用户体验，还需要...
扫码枪扫描二维码或条形码后，会将解码后的数据作为串行数据通过USB接口传输到电脑。 4. **数据解析**：接收到的数据通常是ASCII编码的字符串，DEMO需要将这些字符串解析成有意义的信息，例如，对于二维码，可能是...
HTML5扫描枪录入工具自动识别来自扫描枪录入的条码并进行提交，屏蔽来自键盘的录入。版本号命名规则X: 版本号, Y: 修订号, Z: 迭代次数如：Ver.X.Y.Z 代表第X版，第Y次修订，第Z次迭代。开源声明Given enough ...
这个过程展示了如何在Java环境中实现电脑端的二维码扫描，涵盖了从捕获图像到解码的整个流程，是Web应用中实现类似功能的一个基础示例。为了提高性能和用户体验，可以考虑使用多线程处理图片上传和解码，以及优化...
"JavaScript集成光标扫码枪"是将扫码枪的功能与网页相结合的技术，它使得用户可以通过扫码枪直接在网页上输入扫描数据，提高了数据录入的效率和准确性。以下是对这个主题的详细解析： 1. **页面js集成扫码枪扫码...
在这个DEMO中，扫码枪被配置为模拟键盘输入，当扫描一个条码或二维码时，其内容会被当作键盘输入传递给Web应用。 4. **事件监听**： - 在Java应用中，通常使用事件监听机制来处理输入设备的事件。这个项目可能使用...
这种插件能够将本地的物理扫描仪集成到网页应用中，让用户可以直接在浏览器内完成文件扫描，无需跳出浏览器进行多步操作。这极大地提升了工作效率，尤其对于那些依赖web系统的用户来说，它简化了将纸质文件转换为...
2. **JavaScript与Java交互**：为了实现H5调用Android原生功能，如二维码扫描，需要利用`WebView`的`addJavascriptInterface`方法，在Java层创建一个接口并暴露给JavaScript，使得H5代码可以通过`window对象`调用...
在本案例中，扫码枪通过USB CDC接口与电脑建立连接，将扫描到的条形码或二维码数据传输至计算机。 中标麒麟操作系统是一款国产的Linux发行版，常用于政府和企业领域，以保障信息安全。结合龙芯处理器，这表明此解决...
在JavaScript中实现扫码枪扫描二维码的功能，主要是通过监听键盘事件来获取扫码枪输入的数据。扫码枪扫描二维码的过程，实质上是模拟用户手动输入的过程，因此可以通过监听`onkeypress`事件来捕捉这一行为。以下是对...
在IT行业中，"WEB + JS 扫码枪"是一个典型的前端技术应用场景，它结合了Web技术与JavaScript（JS）的功能，使得网页能够直接处理来自扫码枪的数据输入。在这个场景下，用户无需点击任何按钮，只需通过扫码枪扫描条形...
在JavaScript编程中，有时我们需要与硬件设备如USB扫码枪进行交互，以便实时获取扫描到的数据。本文将介绍一种有效的方法来处理USB扫码枪输入的数据，确保数据完整无误，并能够自动触发登录功能。 首先，要获取USB...
4. **JSON打包**：JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，易于人阅读和编写，同时也易于机器解析和生成。在这里，客户端收集的信息会被结构化为JSON格式，便于服务器解析和存储。JSON格式...