验证码生成并确认

最新推荐文章于 2024-09-26 01:42:12 发布

海绵老呆

最新推荐文章于 2024-09-26 01:42:12 发布

阅读量122

点赞数

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/m0_37343874/article/details/120038732

版权

JavaScript 验证码随机生成输入验证网页交互

关键词由CSDN通过智能技术生成

js 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="v_code">
    <div class="code_show">
        <span class="code" id="checkCode">gfdsse</span>
        <a href="" id="linkbt">看不清换一张</a>
    </div>
    <div class="input_code">
        <label for="inputCode">验证码：</label>
        <input type="text" id="inputCode">
        <span id="text_show"></span>
    </div>
    <input type="button" id="Button1" value="确定">
</div>
<script>
    window.onload = function () {
		let res = getCode();
		function getCode() {
			let arr = ['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f','g','h']
			let str = ''
			for (let i = 0; i < 6; i++){
				let num = Math.round(Math.random()*17)
				str += arr[num]
			}
			return str
		}
		document.getElementById('checkCode').innerHTML = res
        document.getElementById('linkbt').onclick = function () {
			document.getElementById('checkCode').innerHTML = getCode()
		}
		let btn = document.getElementById('Button1')
		btn.onclick = function () {
            let checkCode = document.getElementById('checkCode').innerHTML
            let inputCode = document.getElementById('inputCode').value
            if (checkCode != inputCode){
            	alert('验证码输入不正确')
				document.getElementById('inputCode').value = ''
            }else {
            	alert('验证码输入成功')
            }
		}
	}
</script>
</body>
</html>