我有一个 HTML 输入
<input type="text" id="txtInput">
并且我需要禁用所有键盘按键进行输入，只允许条形码扫描仪获取条形码数据并用输入填充它。
我尝试了“只读”和“禁用”以及 javaScript keydown，但所有这些解决方案都禁用了包括条形码扫描仪在内的所有功能。
有什么办法可以做到吗？
【问题讨论】：
标签： javascript jquery html input barcode-scanner
因此，首先您需要了解条形码扫描仪会伪装成键盘。所以它们会像真正的键盘一样触发 JS 击键事件。我能想到的将 2 分开的唯一方法是一些基于时间的启发式方法（这个想法是没有人可以在 0.1 秒内输入完整的 10 位条形码）。
所以基本上，你会有一些 javascript 来做这些事情：
这会很难看，但如果你真的绝望，它可能会起作用
var delay = (function(){
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
$("#txtInput").on("input", function() {
delay(function(){
if ($("#txtInput").val().length < 8) {
$("#txtInput").val("");
}
}, 20 );
});
【讨论】：
在我向您回复以寻求解决方案后，我一直在思考，因为在 DOS/Windows 时代，这曾经是一个非常常见的请求，但不是通过网络。
您可以做的是设置您的扫描仪并在扫描开始时发送一组字符串字符作为扫描的“起点”，然后发送一些其他字符作为结束，我在想这样的事情：
然后您可以在 ENTER 字符处过滤该字段的内容，并检查它是否来自您的扫描仪，然后分配它。不确定您的扫描仪是否支持扫描前的待处理数据，但如果支持，那么绝对值得一试。
【讨论】：
<script>
setTimeout('timedRefresh()', 300000);
setTimeout('refocus()', 1000);
//********** KEYPRESS PREVENTION
$(document).ready(function(){
$("#txtInput").keypress(function() {
setTimeout('refocus()', 700)
});
});
//********** PASTE PREVENTION $(document).ready(function(){
$(document).on("cut copy paste","#txtInput",function(e) {
e.preventDefault();
});
});
当您按下它会清除每个字符。但您可以使用条码扫描仪来输入您的文本。您也不允许粘贴。 700 毫秒超时是我认为条形码键入文本并按 Enter 的最优化时间。
【讨论】：
<input type="number" id="txtInput">
这将只允许输入数字
【讨论】：
我发现了一个 jquery 脚本，它检测键盘输入与扫描仪 https://jsfiddle.net/PhilM/Bf89R/3/ 并对其进行了修改以阻止键盘输入、粘贴和自动填充。
在 html 中我禁用了 autofil。
<form autocomplete="off" onsubmit="return false">
<input type="text" id="scanInput"/>
</form>
然后使用查询来检测和阻止键盘和粘贴条目。
let inputStart, inputStop;
$("#scanInput")[0].onpaste = e => e.preventDefault();
// handle a key value being entered by either keyboard or scanner
var lastInput
let checkValidity = () => {
if ($("#scanInput").val().length < 10) {
$("#scanInput").val('')
} else {
$("body").append($('<div style="background:green;padding: 5px 12px;margin-bottom:10px;" id="msg">ok</div>'))
}
timeout = false
}
let timeout = false
$("#scanInput").keypress(function (e) {
if (performance.now() - lastInput > 1000) {
$("#scanInput").val('')
}
lastInput = performance.now();
if (!timeout) {
timeout = setTimeout(checkValidity, 200)
}
});
【讨论】：