JavaScript 验证码示例

2021/6/27 20:20:24

本文主要是介绍JavaScript 验证码示例,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

在本教程中,您将获得 JavaScript 验证码示例。

Captcha 用于确定填写和提交 Web 表单的用户是否为人类。在开发 Web 项目时,我们经常需要添加验证码功能。

所以在这里我分享了在 JavaScript 中创建验证码的最简单方法。它看起来如下图所示。

注意:不要在实时 Web 项目中使用此方法,因为此实现已被攻击者读取并且他/她可以对其进行操作。一切都应该在服务器端处理。您可以在学校或大学项目中使用这种验证码生成方法。

JavaScript 验证码示例

JavaScript 验证码示例

下面的代码在 JavaScript 中生成一个 4 位数的验证码。

<html>
<head><title>JavaScript Captcha Example</title></head>
<body onl oad="generateCaptcha()">
 
<script>
var captcha;
 
function generateCaptcha() {
    var a = Math.floor((Math.random() * 10));
    var b = Math.floor((Math.random() * 10));
    var c = Math.floor((Math.random() * 10));
    var d = Math.floor((Math.random() * 10));
 
captcha=a.toString()+b.toString()+c.toString()+d.toString();
    document.getElementById("captcha").value = captcha;
}
 
function check(){
var input=document.getElementById("inputText").value;
 
if(input==captcha){
alert("Equal");
}
else{
alert("Not Equal");
}
}
</script>
 
<input type="text" id="captcha" disabled/><br/><br/>
<input type="text" id="inputText"/><br/><br/>
<button onclick="generateCaptcha()">Refresh</button>
<button onclick="check()">Submit</button>
 
</body>
</html>

解释

在上面的脚本中,generateCaptcha() 函数用于在页面加载时生成验证码。这是由body标签中的onload属性完成的。在 generateCaptcha() 中,我们使用 Math.floor((Math.random() * 10))来生成 1(包含)和 10(不包含)之间的随机数。这样我们就生成了四个随机数,然后将它们连接起来形成一个字符串。所述的toString()方法被用于数字转换为字符串。现在我们将此字符串设置为验证文本框的值。

提交按钮被点击的检查()函数被调用的是检查是否与验证码原来还是不输入验证码匹配。如果它们匹配,则显示“相等”警报,否则显示“不相等”警报。

刷新按钮用于重新生成验证码。



这篇关于JavaScript 验证码示例的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程