B/S系统中关于条码扫描器输入的处理代码,JS代码库,德仔网

代码语言

代码分类

【JS】 B/S系统中关于条码扫描器输入的处理

作者:Lemon_C / 发布于2014/11/7/ 443

当扫描枪进行条码扫描时相当于在键盘输入字符+回车，所以没有扫描枪可以直接输入数字后回车就好。一维条码，扫描时先把鼠标焦点定位到文本框。快捷键：Alt+Q


	<!DOCTYPE html>
	<html lang="zh">
	<head>
	 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	 <title>条码扫描</title>
	 <script src="jquery.js"></script>
	 <script type="text/javascript">
	 $(function(){
	 var barcodeList = {};
	 //var barcodeList = {"12345679":25, "789456123":20, "45678913":10};
	 $("form").submit(function(){
	 var barcode = $("input[name='barcode']").val();
	
	 if(barcode == '') {console.log(barcode);return false;}
	
	 if("undefined" == typeof(barcodeList[barcode])) {
	 //console.log("不存在");
	 barcodeList[barcode] = 1;
	 } else {
	 //console.log("存在");
	 barcodeList[barcode]++;
	 }
	
	 console.log(barcodeList);
	 output(barcodeList);
	
	 $("span").empty().text(barcode);
	 $("input[name='barcode']").val("");
	 return false;
	 });
	
	 var output = function(barcodeList) {
	 $("tbody").empty();
	 $.each(barcodeList, function(barcode, quantity){
	 $("tbody").append("<tr><td>"+barcode+"</td><td>"+quantity+"</td></tr>");
	 });
	 }
	 });
	 </script>
	 <style>
	 table {
	 margin-top: 10px;
	 border-collapse: collapse;
	 border: 1px solid #aaa;
	 width: 500px;
	 }
	 table th {
	 vertical-align: baseline;
	 padding: 5px 15px 5px 6px;
	 background-color: #d5d5d5;
	 border: 1px solid #aaa;
	 text-align: left;
	 }
	 table td {
	 vertical-align: text-top;
	 padding: 6px 15px 6px 6px;
	 background-color: #efefef;
	 border: 1px solid #aaa;
	 }
	 </style>
	</head>
	<body>
	<form>
	 <b>条码：</b><input type="text" name="barcode" accesskey="q" autofocus> <span>(快捷键：Alt+Q)</span>
	</form>
	
	<table>
	 <thead>
	 <tr>
	 <th>条码</th>
	 <th>数量</th>
	 </tr>
	 </thead>
	 <tbody>
	 </tbody>
	</table>
	</body>
	</html>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　条码扫描器　　输入　

同语言下

可能有用的

Lemon_C贡献的其它代码(2)