我有以下代码来输入条形码的读取值:

$(document).ready(function(){
  $(".scanner-input").focus().on("input",function(){
       let barcode = $(this).val();  
  })
});
.lnr {
    margin-top: 5%;
    font-size: 1000%;
 }
<link href="https://cdn.jsdelivr.net/npm/pixeden-stroke-7-icon@1.2.3/pe-icon-7-stroke/dist/pe-icon-7-stroke.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form" method="post" action="">
  <input type="text" name="ColabAssid" class="scanner-input" id="ColabAssid" value="">
  <button type="submit" class="btn btn-success btn-xl" onclick="inserir_assid();"> <i class="pe-7s-look lnr"></i></button>
</form>

它以这种方式运行得很好. 但我想隐藏输入,我用以下两种方法做到了:

<input type="hidden" name="ColabAssid" class="scanner-input" id="ColabAssid" value="">

<input style="display:none;" type="text" name="ColabAssid" class="scanner-input" id="ColabAssid" value="">

问题是,在我上面提到的两种方式中,输入不再接收条形码读数的值.

如何在隐藏输入的同时仍能收到条形码读取值?

推荐答案

我用隐藏输入写了一个例子,希望对你有帮助!

要try 这个例子,只需按type something,然后按Enter.

let $scannerInput = $(".scanner-input");

$(document).ready(function(){
  $scannerInput.focus();
});

$(document).on('keydown', (ev) => {
    if (ev.ctrlKey || ev.altKey) return; // Ignore command-like keys
    if (ev.key == 'Enter') {
      console.log('Barcode result: ' + $scannerInput.val())
      $scannerInput.val('')
    } else if (ev.key == 'Space') { // I think IE needs this
      $scannerInput.val($scannerInput.val() + ' ');
    } else if (ev.key.length == 1) { // A character not a key like F12 or Backspace
      $scannerInput.val($scannerInput.val() + ev.key);
    }
});
.lnr {
  margin-top: 5%;
  font-size: 1000%;
}
<link href="https://cdn.jsdelivr.net/npm/pixeden-stroke-7-icon@1.2.3/pe-icon-7-stroke/dist/pe-icon-7-stroke.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form" method="post" action="">
  <input type="hidden" name="ColabAssid" class="scanner-input" id="ColabAssid" value="">
  <button type="submit" class="btn btn-success btn-xl" onclick="inserir_assid();"> <i class="pe-7s-look lnr"></i></button>
</form>

Javascript相关问答推荐

未捕获错误:[]:getActivePinia()被调用,但没有活动Pinia.🍍""在调用app.use(pinia)之前,您是否try 使用store ?""

构造HTML表单以使用表单数据创建对象数组

显示图—如何在图例项上添加删除线效果?

如何通过使用vanilla JS限制字体大小增加或减少两次来改变字体大小

JS,当你点击卡片下方的绿色空间,而它是在它的背后转动时,

类构造函数不能在没有用With Router包装的情况下调用

从Nextjs中的 Select 项收集值,但当单击以处理时,未发生任何情况

在使用REACT更改了CSS类之后,无法更改CSS样式

有效路径同时显示有效路径组件和不存在的路径组件

每次重新呈现时调用useState initialValue函数

使用jQuery find()获取元素的属性

为什么NULL不能在构造函数的.Prototype中工作

连续添加promise 时,如何在所有promise 都已结算时解除加载覆盖

我们是否可以在reactjs中创建多个同名的路由

material UI自动完成全宽

如何调用多个$HTTP.POST请求?

如果用户的页面宽度低于某个阈值,如何使用js更改html页面中的css文件

需要将源自AJAX的数据添加到表中

我的本地计算机上的时区偏移量加倍,但在UTC服务器上工作正常.为什么?

无法将bson类型转换为日期MongoDB