Verification of verification code by Javascript code

I've shared how to use it before H5+Javascript generate verification code (click to see my previous blog). Today, I want to share how to generate a set of verification codes by using random numbers, and verify whether the input verification codes match through js code.

First look at the renderings:

The overall effect is: click the "verification button" or click the verification code itself, and the verification code will be regenerated.

If you enter any characters in the input box that do not match the verification code, you will be prompted "verification code input error".

When the characters entered in the input box (Note: case insensitive here) are consistent with the verification code, the prompt "correct input" will be prompted.

Look at the code:

html code (because css style is simple, there is no special reference to css file):

<!DOCTYPE html>
		<meta charset="utf-8" />
		<style type="text/css">  
       <script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script><!--Casually quoted jq-->
       <script type="text/javascript" src="js/checkCode.js" ></script><!--Self written verification method-->
            <input type = "text" id="input1"/>  
            <input type = "button" id="code" />  
            <input type = "button" id="yz" value = "Verification" />  

checkCode.js Code:

var code ; //Define verification code globally   
//Generate verification code  
	window.onload = createCode("#code");
//Generate verification code
function createCode(code1){
		     code = "";   
		     var codeLength = 4;//Length of verification code  
		     var checkCode =$(code1); 
		     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++) {//Cyclic operation  
		        var index = Math.floor(Math.random()*36);//Get index of random number (0 ~ 35)  
		        code += random[index];//Get random number according to index and add it to code  
		checkCode.val(code);//Assign code value to verification code    
function validate(txtinput,code1){  
	    var inputCode = $(txtinput).val().toUpperCase(); //Get the input verification code and convert it to uppercase  
	    if(inputCode.length <= 0) { //If the length of the verification code entered is 0  
	        alert("Please enter the verification code!"); //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 pop-up verification code input error  
	        createCode(code1);//Refresh verification code  
	        $(txtinput).val("");//Empty text box  
	    else { //When the input is correct  
	        alert("Input correct"); //Pop up ^  


Keywords: Javascript JQuery

Added by jstarkey on Tue, 07 Jan 2020 02:31:30 +0200