标签：调用 creat code 存储 and input 链接 doctype dex
情形一：图形验证码跟短信验证码一起，只需要将后台提供的动态链接填到（id="img"）的src中即可生成动态验证码。
然后，在需要请求接口的地方，只需把（id="imgCode"）中用户输入的信息通过ajax传给后台，验证验证码是否正确。
原理（后台）：后台通过session存储图片上的字符串，和之后前台请求过来的带的输入的字符串参数，做比较，判断是否一样。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>图形验证码</title>
</head>
<body>
<form>
<div class="imgCodeBox">
<label for="imgCode">图形验证码</label>
<input type="text" placeholder="请输入验证码" id="imgCode">
<img src="" id="img">
</div>
</form>
</body>
</html>
情形二：用js产生随机数实现
1、创建图形码容器
<label class="myLabel">图形码：
<input type = "button" id="code" onclick="createCode()" style="border: 0;background-color: transparent;padding: 0;"/>
</label>
2、产生验证码并在页面加载时和点击时调用
// 图形验证码 var code ; //在全局定义验证码 //产生验证码 window.onload = function createCode(){ code = ""; var codeLength = 4;//验证码的长度 var checkCode = document.getElementById("code"); var random = new Array(0,1,2,3,4,5,6,7,8,9,‘A‘,‘B‘,‘C‘,‘D‘,‘E‘,‘F‘,‘G‘,‘H‘,‘I‘,‘J‘,‘K‘,‘L‘,‘M‘,‘N‘,‘O‘,‘P‘,‘Q‘,‘R‘, ‘S‘,‘T‘,‘U‘,‘V‘,‘W‘,‘X‘,‘Y‘,‘Z‘);//随机数 for(var i = 0; i < codeLength; i++) {//循环操作 var index = Math.floor(Math.random()*36);//取得随机数的索引（0~35） code += random[index];//根据索引取得随机数加到code上 } checkCode.value = code;//把code值赋给验证码 }
标签：调用 creat code 存储 and input 链接 doctype dex
原文地址：https://www.cnblogs.com/dingboyang/p/10991239.html
