`
tooby
  • 浏览: 117410 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js接收串口数据

 
阅读更多

<html> 
<head> 
<title>JavaScript串口测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<SCRIPT   ID=clientEventHandlersJS   LANGUAGE=javascript> 
<!--   
  function   MSComm1_OnComm()   
  {      
      switch(MSComm1.CommEvent)
     {
       case 1:{ window.alert("Send OK!"); break;}  //发送事件
       case 2: { Receive();break;} //接收事件
       default: alert("Event Raised!"+MSComm1.CommEvent);;
      }       
 } 
//--> 
</SCRIPT>

<SCRIPT   LANGUAGE=javascript   FOR=MSComm1   EVENT=OnComm> 
<!--
// MSComm1控件每遇到 OnComm 事件就调用 MSComm1_OnComm()函数
     MSComm1_OnComm();
//--> 
</SCRIPT> 

<script   language="JavaScript"   type="text/JavaScript"> 
<!-- 
    String.prototype.Blength = function()
{  
    var arr = this.match(/[^\x00-\xff]/ig);  
    return  arr == null ? this.length : this.length + arr.length;  
    }  

  function OperatePort()
  {
     if(MSComm1.PortOpen==true)
    {
      try
  {
    MSComm1.PortOpen=false;
        document.getElementById("OperateButton").value="打开串口";
      }
  catch(ex)
      {
  alert(ex.message);
  }       
    }
    else
{
     try
 { 
MSComm1.PortOpen=true;
        document.getElementById("OperateButton").value="关闭串口";
     }
 catch(ex)
     {
 alert(ex.message);
 }     
    }
 }

 function ConfigPort()
 {
   if(MSComm1.PortOpen==false)
   {   
    try
{
      MSComm1.CommPort=document.getElementById("ComName").value;
      MSComm1.Settings=document.getElementById("BaudRate").value.toString()+
                        ","+document.getElementById("CheckBit").value.toString()+
                        ","+document.getElementById("DataBits").value.toString()+
                        ","+document.getElementById("StopBits").value.toString();   
       MSComm1.OutBufferCount =0;           //清空发送缓冲区
       MSComm1.InBufferCount = 0;           //滑空接收缓冲区                         
       alert("已配置串口COM"+MSComm1.CommPort+"\n 参数:"+MSComm1.Settings);       
     }
 catch(ex)
 {
 alert(ex.message);
 }
   }
  else
   { 
  alert("请先关闭串口后再设置!");
   }
 }

 function Send()
 {
    //alert(document.getElementById("txtSend").value);
    var orgstr=document.getElementById("txtSend").value;     
    var newstr="";
    var hexflag=document.getElementById("isSendHex").checked;
     if(hexflag&&orgstr!="")
    {
      if(orgstr.substr(0,2)=="0x"||orgstr.substr(0,2)=="0X")
  {
  orgstr=orgstr.substring(2,orgstr.length);
  }
      if(orgstr.length%2!=0)
  {
  orgstr="0"+orgstr;
  }
      if((newstr=str2hex(orgstr,16))=="")
  {
  alert("错误的16进制数");return false;
  }
    }
     try
 {
       MSComm1.Output=hexflag?newstr:orgstr;      
     }
 catch(ex)     
     {
 alert(ex.message);
 }
 }
function Receive()
{   
   document.getElementById("txtReceive").value += MSComm1.Input;   
}
 
function ClearReceived()
 {
    document.getElementById("txtReceive").innerText="";
 } 
--> 
</script>   

</head> 
<body>
<form name="form1">     
<fieldset style="width:200px;height:250px;text-align:center;">
   <legend>配置串口</legend>
   <div style="float:left;width:200px">   
   <br/>   
   <span>串口号:</span>
   <select name="ComName" id="ComName" style="width:75px" >
   <option value="1"  >COM1</option>
   <option value="2"  >COM2</option>
   <option value="3" selected >COM3</option>
   <option value="4"  >COM4</option>   
   </select>   
   <br/>   
   <span>波特率:</span>
   <select name="BaudRate" id="BaudRate" style="width:75px" >
   <option value="9600" selected  >9600</option>
   <option value="57600"  >57600</option>
   <option value="115200" >115200</option>   
   </select>   
   <br/>
 
   <span>校验位:</span>
   <select name="CheckBit" id="CheckBit" style="width:75px" >
   <option value="N" selected  >无NONE</option>
   <option value="O"  >奇ODD</option>
   <option value="E" >偶EVEN</option>   
   </select>   
   <br/>   
  
   <span>数据位:</span>
   <input type=text id="DataBits" name="DataBits" value=8 style="width:75px;height:20px">
   <br/>
 
   <span>停止位:</span>
   <input type=text id="StopBits" name="StopBits" value=1 style="width:75px;height:20px">
   <br/>
   <br/>
   <input   type="button" id="ConfigButton" style="width:80px;height:30px;font-size:13px"   name="ConfigButton"   value="配置串口"   onClick="ConfigPort()">       
   <input   type="button" id="OperateButton" style="width:80px;height:30px;font-size:13px"   name="OperateButton"   value="打开串口"   onClick="OperatePort()">       
   </div> 
</fieldset>

<fieldset style="width:200px;height:250px;text-align:center;">
   <legend>发送区域</legend>
   <div style="float:left;">
   <textarea id="txtSend"  name="txtSend" style="width:200px;height:160px"></textarea> 
   <br/>
   <span><input id="isSendHex" name="isSendHex" type="checkbox" checked="0" />16进制</span>
   <input   type="button" id="SendButton" style="width:100px;height:30px"   name="SendButton"   value="发送"   onClick="Send()">   
   </div> 
</fieldset>

<fieldset style="width:200px;height:250px;text-align:center;">
   <legend>接收区域</legend>   
   <div style="float:left;">
   <textarea id="txtReceive" READONLY=TRUE  name="txtReceive" style="width:200px;height:160px"></textarea>  
   <br/>
   <span><input id="isReceiveHex" name="isReceiveHex" type="checkbox" />16进制</span>
   <input  type="button" id="ClearButton" style="width:100px;height:30px"   name="ClearButton"   value="清空"   onClick="ClearReceived()">
   </div>
</fieldset>   
</form> 

<OBJECT ID="MSComm1" WIDTH=100 HEIGHT=51 type="application/x-oleobject"
 CLASSID="CLSID:648A5600-2C6E-101B-82B6-000000000014"
 CODEBASE="MSCOMM32.OCX">
    <PARAM NAME="_ExtentX" VALUE="2646">
    <PARAM NAME="_ExtentY" VALUE="1323">
    <PARAM NAME="_Version" VALUE="393216">
    <PARAM NAME="DTREnable" VALUE="-1">
    <PARAM NAME="RThreshold" VALUE="1">
    <PARAM NAME="RTSEnable" VALUE="-1">
</OBJECT>
</body> 
</html>  

分享到:
评论

相关推荐

    js接收串口数据,测试过完全可用的,不骗人

    标题提到的“js接收串口数据,测试过完全可用的,不骗人”表明这是一个实现了JavaScript串口通信功能的示例,可能是一个小型的Web应用或者网页原型,能够接收并处理串口传输的数据。 描述中提到,该应用被用来接收...

    js 调用串口+使用 JS 获得串口数据+浏览器中使用js调用串口通讯

    IE浏览器中访问COM口收发数据,可以访问com口打印机、GSM 猫、手机、串口扫描枪等设备,支持使用HEX 字节发送接收,更好地支持各种COM口设备,可以用于web系统中访问串口或者虚拟串口的硬件设备。

    js 调用串口+使用 JS 获得串口数据+浏览器中使用js调用串口通讯.zip

    IE浏览器中访问COM口收发数据,可以访问com口打印机、GSM 猫、手机、串口扫描枪等设备,支持使用HEX 字节发送接收,更好地支持各种COM口设备,可以用于web系统中访问串口或者虚拟串口的硬件设备。

    asp.net读取串口数据

    5. **前端展示**:使用HTML、CSS和JavaScript(可能需要jQuery或Vue.js等库)创建用户界面,动态更新接收到的串口数据。 6. **安全性与权限**:由于涉及硬件访问,必须确保服务运行在具有足够权限的账户下,并且对...

    Java读取串口数据并可在网页上调用

    可以设定监听器来实时接收串口数据。 2. **数据解析与处理**: - **数据解析**: 串口接收到的数据通常是字节流,需要根据协议进行解析。例如,如果数据是以特定字符开始和结束的,可以用`BufferedReader`读取并...

    javascript实现串口通信(亲身测试).zip_MSComm 判断 通_js串口r232_touchu5v_上位机_串口通

    "串口通信"是整个主题的核心,它包括数据的发送和接收,错误检测与纠正,以及流控制等。在JavaScript中,我们需要处理如何正确设置串口参数,如何监听数据到达事件,以及如何正确发送数据。 综上所述,要使用...

    web前端js串口数据通讯

    第一步,复制MSCOMM32.OCX 到 C:\WINDOWS\SysWOW64(如果是32位系统就是C:\WINDOWS\SysWOW32) 依次运行下面三条命令(以管理员身份运行,注意根据系统32位和64位更改命令中的路径): regsvr32 /u C:\WINDOWS\SysWOW64\...

    串口助手接收ModBus协议收上来的数据并进行处理

    通过微软的串口调试助手,利用JavaScript脚本编写数据采集程序,程序设计,是通过查阅资料和程序组合进行设计,ModBus RTU协议的使用,以及与设备的连接是通过RS485进行数据连接。

    JavaScript操作串口

    因此,如果要实现跨平台的串口通信,可以考虑使用Node.js环境下的库,如`serialport`,它能提供与JavaScript操作串口相似的功能,但适用于服务器端而非客户端。 在Asp.Net操作串口的场景下,可以创建一个ASP.NET ...

    基于nodejs实现的串口通信

    本文将深入探讨如何使用Node.js实现串口通信,包括设置波特率、数据位、奇偶校验和停止位,以及如何接收和发送数据。 首先,让我们了解什么是串口通信。串口通信,也称为串行通信,是指数据逐位按顺序进行传输的...

    ModBus RTU协议数据接收和串口波形显示.txt

    ModBus RTU协议数据接收和串口波形显示,采集自己所需要的数据,可以将数据进行波形显示,串口助手用的是win10系统中微软自带的串口助手,波形显示需要升级为专业版,脚本采用JavaScript语言

    electron-serialport.zip_electron 读串口_electron串口_nodejs_nodejs串口编

    在处理串口通信这类后台任务时,通常在主进程中进行,然后通过IPC(Inter-Process Communication)机制与渲染进程通信,将串口数据传递给前端界面。 6. **示例代码**: 压缩包中的“electron-serialport”可能包含...

    串口采集数据实时曲线

    常用的可视化库有Python的Matplotlib、Plotly,或者JavaScript的D3.js等。 实现这个功能通常分为以下步骤: 1. **串口设置**:配置串口参数,如波特率、数据位、停止位、校验位等,确保与发送端设备的设置一致。 ...

    web和串口交互,利用js+HTML+mscomm32控件

    控件提供了设置波特率、数据位、停止位、校验位等功能,并且可以监听串口的数据接收事件。 实现web和串口交互的步骤通常包括: 1. **创建HTML页面**:设计用户界面,包含必要的输入输出元素,如按钮、文本框等。 2...

    JS操作本地网页串口源码

    总的来说,JS操作本地网页串口是Web技术与硬件设备结合的重要突破,它使得JavaScript能够应用于更多实际场景,如物联网(IoT)和工业自动化。理解并掌握Web Serial API及其应用,对于开发者来说具有重要意义。

    javascript实现串口通信(亲身测试).rar

    这个文件应该会讲解如何在网页中引用并使用MSCOMM32.ocx控件,以及如何用JavaScript编写控制串口的函数,如打开串口、设置波特率、数据位、停止位、校验位,发送和接收数据等。 实现JavaScript串口通信的关键步骤...

    串口网络数据调试助手V1.5

    智联物联串口网络数据调试助手V1.5是一款非常好用的调试工具,串口网络数据调试助手V1.5显示流畅,不容易丢数据,支持字符串和十六进制方式显示,和加时间戳分数据包显示。 串口网络数据调试助手V1.5特点 1、显示...

    基于node-serialport的WEB串口通信 上位机工具

    【基于node-serialport的WEB串口通信上位机工具】是一种使用JavaScript和Node.js环境构建的串口通信解决方案,特别适用于需要通过Web界面进行串口数据交互的应用场景。这个工具利用了`node-serialport`库,它是一个...

    电子秤串口调试工具

    对于“检测测试”这一标签,我们可以理解为该工具具备了多种测试功能,如发送测试数据、接收验证、波特率检测、奇偶校验检查等。这些功能使得用户在实际应用前能对整个系统进行全面的性能评估和故障排查。 至于...

    android 安卓 读取 串口

    - **蓝牙串口模拟**:像EF_BluetoothBee这样的模块可以模拟串口通信,通过蓝牙连接将串口数据发送和接收。 - **蓝牙配置**:在Android应用中,需要设置蓝牙适配器,扫描、连接到蓝牙设备,并建立BluetoothSocket...

Global site tag (gtag.js) - Google Analytics