This article shares the function of automatically generating dynamic HTML verification code for JS, and automatically clearing the input box for your reference. The specific content is as follows
<!DOCTYPE html>
<html>
<head>
<title>Verification code</title>
<meta charset="utf-8" />
<style type="text/css">
#code {
font-family: Arial;
font-style: italic;
font-weight: bold;
border: 0;
letter-spacing: 2px;
color: blue;
}
</style>
<script>
//Generate verification code = function() {
createCode()
}
var code; //Define the verification code globally function createCode() {
code = "";
var codeLength = 4; //Length of verification code var checkCode = ("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'); //Random number for(var i = 0; i < codeLength; i++) { //Cycle operation var index = (() * 36); //Get the index of the random number (0~35) code += random[index]; //Get random numbers based on the index and add them to the code }
= code; // Assign the code value to the verification code }
//Calculation verification code function validate() {
var inputCode = ("ctl00_txtcode").(); //Get the verification code in the input box and convert it to capital if( <= 0) { //If the entered verification code length is 0 alert("Please enter the verification code!"); //If you pop up, please enter the verification code }
else if(inputCode != code) { //If the input verification code is inconsistent with the generated verification code alert("Verification code input error!"); //The verification code is entered incorrectly createCode(); //Refresh the verification code ("ctl00_txtcode").value = "";//Clear the text box } else { //When the input is correct alert("Logining in"); //pop up }
}
</script>
</head>
<body>
<div>
<!--time：2017-01-11 describe：Input boxct100_textcode -->
<input type="text" />
<!--time：2017-01-11 describe：把Verification code定义为按钮，Click Refresh-->
<input type="button" onclick="createCode()" />
<!--time：2017-01-11 describe：Verification button -->
<input type="button" value="verify" onclick="validate()" />
</div>
</body
</html>
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.