前端开发验证码(字符串和Math综合应用)
摘要： web前端开发技术储久良答案 web前端技术开发 web前端开发技术的实践教学 代码片段 1 <!DOCTYPE html> <html> <head> <meta charset=”utf-8″ /> ……
| web前端开发技术储久良答案 |
| web前端技术开发 |
| web前端开发技术的实践教学 |
代码片段 1
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″ />
<title>验证码</title>
<style>
html,
body,
div {
margin: 0;
padding: 0;
}
#validate {
position: absolute;
top: 50%;
left: 50%;
margin-left: -50px;
margin-top: -20px;
width: 100px;
height: 40px;
background: #f0f000;
font-size: 28px;
line-height: 40px;
text-align: center;
}
</style>
</head>
<body>
<div id=”validate”></div>
<script>
//0-61个索引中随机生成四个索引数，通过charAt取到对应的字符
var codeStr =
‘abcdefghijklmnopqrstuvwxzyABCDEFGHIJKLMNOPQRSTUVWXZY0123456789’
var validate = document.getElementById(‘validate’)
function getRandom(n, m) {
n = Number(n)
m = Number(m)
if (isNaN(n) || isNaN(m)) {
return Math.random()
}
if (n > m) {
var temp = n
n = m
m = temp
}
return Math.round(Math.random() * (m – n) + n)
}
function getCode() {
var str = ”
for (var i = 0; i < 4; i++) {
var random = getRandom(0, 61)
str += codeStr.charAt(random)
}
validate.innerHTML = str
}
getCode()
validate.onclick = function() {
getCode()
}
</script>
</body>
</html>
| web前端开发技术现状 |
| 中高级前端开发技术 |
| web前端开发技术汇总 【转】 |
» 本文来自：前端开发者 » 《前端开发验证码(字符串和Math综合应用)》
» 本文链接地址：https://www.rokub.com/7521.html
» 您也可以订阅本站：https://www.rokub.com
近期评论