数据结构
网络
关系数据库管理系统(RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会研究
时尚研究
法学研究使用JavaScript设置PIN验证？
在本文中，我们将讨论如何使用JavaScript设置PIN验证。我们将涵盖创建提示以供用户输入其PIN号码、根据存储的值验证用户输入以及根据比较结果返回适当的响应等主题。
数据验证是用于确保用户输入准确、可靠和整洁的过程。根据典型的验证过程，用户已输入有效日期、数字字段中的文本以及所有必需字段均已填写。
我们可以根据长度和类型（例如，PIN必须是字符串）来验证PIN。让我们看看以下示例，以了解有关使用JavaScript进行PIN验证的更多信息。
示例
在以下示例中，我们使用简单的正则表达式来形成脚本中的验证。
<!DOCTYPE html>
<html>
<body>
<p id="tutorial1"></p>
<p id="tutorial2"></p>
<p id="tutorial3"></p>
<p id="tutorial4"></p>
<script>
function validatePIN (pin) {
return /^(\d{4}|\d{6})$/.test(pin);
}
document.getElementById("tutorial1").innerHTML= JSON.stringify(validatePIN('1234'));
document.getElementById("tutorial2").innerHTML=JSON.stringify(validatePIN('123'));
document.getElementById("tutorial3").innerHTML= JSON.stringify(validatePIN('123456'));
document.getElementById("tutorial4").innerHTML=JSON.stringify(validatePIN('12345'));
</script>
</body>
</html>
执行脚本时，事件将被触发，使给定的PIN条件与给定的正则表达式进行检查并提供值。如果满足条件，则返回true；否则，返回false。
示例
考虑另一个示例，我们通过调用addEventListener函数来创建输入字段和按钮，并验证PIN。
<!DOCTYPE html>
<html>
<body>
<input type="text" />
<button>validate pin</button>
<script>
var validatePIN = (args) => {[...args] = args; return args.every(v => v.match(/\d/)) && [4, 6].some(n => args.length === n)};
document.querySelector("button")
.addEventListener("click", (e) => alert(validatePIN(e.target.previousElementSibling.value)))
</script>
</body>
</html>
运行上述脚本后，网页浏览器将在网页上显示输入字段和按钮。当用户在输入字段中输入PIN并单击按钮时，将触发事件，并检查是否满足条件，如果满足，则显示“true”或“false”警报。
示例
让我们执行以下代码，其中我们添加了一个额外的条件，该条件检查转换为数字的字符串实际上是否是数字；并返回true或false值。
<!DOCTYPE html>
<html>
<body>
<script>
function test(pin) {
if ((pin.length === 5 || pin.length === 7) && Number.isInteger(+pin)) {
return true
} else {
return false
}
}
document.write(test('12345')+"<br>");
document.write(test('asbcf'));
</script>
</body>
</html>
脚本执行时，事件将被触发，该事件检查PIN条件并检查输入的数字是否有效，然后显示值。在我们的例子中，它将为第一个PIN显示true，为第二个PIN显示false。
示例
考虑以下示例，我们在此示例中运行一个条件来确定传递的PIN是否有效。如果满足条件，它将返回“PIN有效”，否则将显示“PIN无效”。
<!DOCTYPE html>
<html>
<body>
<script>
function simpleValidationForPin(pinValues) {
if (!(typeof pinValues === "string" && !~pinValues.indexOf('.') && !isNaN(Number(pinValues)) && (pinValues.length === 2 || pinValues.length === 4))) {
return false;
} else {
return true;
}
}
if (simpleValidationForPin("0000.00") == true)
document.write("This is a valid pin")
else
document.write("This is not a valid pin"+"<br>")
if (simpleValidationForPin(66) == true)
document.write("This is a valid pin")
else
document.write("This is not a valid pin"+"<br>")
if (simpleValidationForPin("4444") == true)
document.write("This is a valid pin"+"<br>")
else
document.write("This is not a valid pin")
if (simpleValidationForPin("66") == true)
document.write("This is a valid pin"+"<br>")
else
document.write("This is not a valid pin")
if (simpleValidationForPin("666") == true)
document.write("This is a valid pin")
else
document.write("This is not a valid pin")
</script>
</body>
</html>
运行上述脚本后，网页浏览器将显示在运行脚本时触发事件时发生的值，检查条件后跟“if”语句。
更新于：2023年1月18日
2K+ 次浏览
广告