使用jQuery来对这两个输入框进行验证,确保只允许输入字母和数字,不允许输入中文字符。 以下是相应的示例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<input type="text" class="form-control" placeholder="定位手环、卡片编号" id="deviceId" />
<input type="text" class="form-control" placeholder="请输入NFC编号" id="nfcId" />
<script>
$(document).ready(function() {
// NFC编号输入框验证
$("#nfcId").on("input", function(event) {
var inputValue = event.target.value;
var regex = /^[a-zA-Z0-9]+$/; // 只允许字母和数字
if (!regex.test(inputValue)) {
event.target.value = inputValue.replace(/[^\w]/g, ''); // 删除非字母和数字的字符
}
});
// 终端编号输入框验证
$("#deviceId").on("input", function(event) {
var inputValue = event.target.value;
var regex = /^[a-zA-Z0-9]+$/; // 只允许字母和数字
if (!regex.test(inputValue)) {
event.target.value = inputValue.replace(/[^\w]/g, ''); // 删除非字母和数字的字符
}
});
});
</script>
</body>
</html>
用$(document).ready()
来在文档加载完成后执行代码。
分别选择了ID为nfcId和deviceId的输入框,并绑定了input事件监听器。
当用户输入内容时,会使用正则表达式/^[a-zA-Z0-9]+$/对输入内容进行验证。
如果输入内容不符合要求(包含非字母和数字的字符,包括中文),
则会将非法字符删除。