<style>
p {
width: 100px;
height: 20px;
text-align: center;
border: 1px dashed black;
}
</style>
<input type="text" id="inp">
<input type="button" value="验证" id="btn">
<p id="show"></p>
<script>
var arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e'];
var str = '';
var p = document.getElementById('show');
function code () {
for (var i = 0; i < 4; i++) {
var a = arr[Math.floor(Math.random() * arr.length)];
// alert(a);
str += a;
}
p.innerHTML = str;
}
code();
p.onclick = function () {
str = '';
code();
}
document.getElementById('btn').onclick = function () {
var inp = document.getElementById('inp').value;
if (inp == str) {
alert('验证成功');
} else {
alert('验证失败');
this.value = '';
}
}
</script>