Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
T
Team6-Digital Insight for Health
Manage
Activity
Members
Labels
Plan
Issues
12
Issue boards
Milestones
Wiki
Requirements
Code
Merge requests
0
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Locked files
Build
Pipelines
Jobs
Pipeline schedules
Test cases
Artifacts
Deploy
Package Registry
Container Registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Code review analytics
Issue analytics
Insights
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
Chen Liang
Team6-Digital Insight for Health
Merge requests
!4
Verification code function test demonstration
Code
Review changes
Check out branch
Download
Patches
Plain diff
Merged
Verification code function test demonstration
cmy
into
main
Overview
0
Commits
1
Pipelines
0
Changes
1
Merged
Mingyuan Chen
requested to merge
cmy
into
main
5 months ago
Overview
0
Commits
1
Pipelines
0
Changes
1
Expand
0
0
Merge request reports
Compare
main
main (base)
and
latest version
latest version
99cc6202
1 commit,
5 months ago
1 file
+
103
−
0
Inline
Compare changes
Side-by-side
Inline
Show whitespace changes
Show one file at a time
verificationcodedemo.html
0 → 100644
+
103
−
0
Options
<!doctype html>
<html>
<head>
<meta
charset=
"utf-8"
>
<title>
js简单验证码使用
</title>
<style>
.code
{
font-family
:
Arial
;
font-style
:
italic
;
color
:
blue
;
font-size
:
30px
;
border
:
0
;
padding
:
2px
3px
;
letter-spacing
:
3px
;
font-weight
:
bolder
;
float
:
left
;
cursor
:
pointer
;
width
:
150px
;
height
:
50px
;
line-height
:
60px
;
text-align
:
center
;
vertical-align
:
middle
;
background-color
:
#D8B7E3
;
}
span
{
text-decoration
:
none
;
font-size
:
12px
;
color
:
#288bc4
;
padding-left
:
10px
;
}
span
:hover
{
text-decoration
:
underline
;
cursor
:
pointer
;
}
</style>
</head>
<script>
// 页面加载时,生成随机验证码
window
.
onload
=
function
()
{
createCode
(
4
);
}
// 生成验证码的方法
function
createCode
(
length
)
{
var
code
=
""
;
var
codeLength
=
parseInt
(
length
);
// 验证码的长度
var
checkCode
=
document
.
getElementById
(
"
checkCode
"
);
// 所有候选组成验证码的字符
var
codeChars
=
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
'
,
'
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
charNum
=
Math
.
floor
(
Math
.
random
()
*
62
);
// 组合成指定字符验证码
code
+=
codeChars
[
charNum
];
}
if
(
checkCode
)
{
// 为验证码区域添加样式名
checkCode
.
className
=
"
code
"
;
// 将生成验证码赋值到显示区
checkCode
.
innerHTML
=
code
;
}
}
// 检查验证码是否正确
function
validateCode
()
{
// 获取显示区生成的验证码
var
checkCode
=
document
.
getElementById
(
"
checkCode
"
).
innerHTML
;
// 获取输入的验证码
var
inputCode
=
document
.
getElementById
(
"
inputCode
"
).
value
;
console
.
log
(
checkCode
);
console
.
log
(
inputCode
);
if
(
inputCode
.
length
<=
0
)
{
alert
(
"
请输入验证码!
"
);
}
else
if
(
inputCode
.
toUpperCase
()
!=
checkCode
.
toUpperCase
())
{
alert
(
"
验证码输入有误!
"
);
createCode
(
4
);
}
else
{
alert
(
"
验证码正确!
"
);
}
}
</script>
<body>
<div>
<table
border=
"0"
cellspacing=
"5"
cellpadding=
"5"
>
<tr>
<td>
<div
id=
"checkCode"
class=
"code"
onclick=
"createCode(4)"
></div></td>
<td>
<span
onclick=
"createCode(4)"
>
看不清换一张
</span></td>
</tr>
<tr>
<td>
验证码:
</td>
<td><input
type=
"text"
id=
"inputCode"
style=
"float:left;"
/></td>
</tr>
<tr>
<td></td>
<td><input
type=
"button"
onclick=
"validateCode()"
value=
"确定"
/></td>
</tr>
</table>
</div>
</body>
</html>
Loading