验证码——实现前端验证码验证(后端登陆注册功能)

　　点开这个页面首先恭喜你！——可以学到一个非常简单的在用户登陆注册的时候用前端实现的验证码验证的功能.

　　我的项目框架为SSM框架，用户的登陆注册以及用户信息的增删改查等等其他的功能时通过java后端技术实现的，对于验证码功能只需要在login.html添加部分代码即可实现。

　　网上的我也搜过查看了好多，但是都是非常繁琐，有前后端分离的、接口调用的、添加工具类的，无论是什么方法他们都有一个共同的特点——代码冗长繁琐，其次就是和自己所要用的方法出入太大，借鉴起来很麻烦，看了半天用处不是多大，所以在此我总结了下，给大家展示一个简单的方法去实现验证码验证的功能，希望对大家有所帮助！

话不多说，上代码！

 

没错,就这么的简单.在scripts生成验证码设为全局变量显示在一个input标签上,首先不考虑登录信息是否有误,只有验证码通过的情况下才会进行表单的提交,在判断登录信息的正确与否.

代码如下，需要的直接拷贝

"-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">



    
        
        "Content-Type" content="text/html; charset=UTF-8">
        
        
         
        
        
        
    

                
       





        
"wrap">
             
"top_centent" >
             
                
"header">
                    
                    
"leftheader" >
                        
                        
"topheader" >
                            
"title" style="text-align:center;" >
                                "#" style="text-decoration: none;color:black">管理员
                            
                        
                        
                     
"navigation">
                     
                    
                        "red">
                            
                        
                    
                        
                
                
                
"content">
                    
                    
"/myfirstssm/jsp/login.action" method="post" οnsubmit="return check()">
                        "0" cellspacing="20" border="0"class="form_table" align="center">
                            

                            

                                
"middle" align="right">
                                    用   户   名:
                                
                                
"middle" align="left">
                                    "text"  name="username" id="username" />
                                
                            
                            
                            

                                
"middle" align="right">
                                    密         码:
                                
                                
"middle" align="left">
                                    "password" name="password" id="password" />
                                
                            
                            

                                
"middle" align="right">
                                    验   证   码:
                                
                                 
                                
"middle" align="left">
                                    "text" id="ctl00_txtcode" />
                                

                                    
"middle">
                                        "button" id="code" οnclick="changeImg()"/>
                                    
                                
                        
                        
                        
"text-align:center">
                            "submit" class="button" value="登陆" />
                            "button" class="button" value="注册" 
                                                onclick="location='/myfirstssm/jsp/register.html'" />
                            "reset" name="reset" value="重置"/>
                        
                        
                    
                
                
            
            
"/myfirstssm/jsp/finduser.action" method="post" >
            
"text-align:center;">"submit" class="button" value="用户信息" />
                
            
            

                










                








                
"text-align:left">Copyright © 2019 雨如烟
                
"time" style="text-align:right">
            
         
    

 

 

认真看过此篇的小伙伴，如果对你有收获，请点击旁边的小手推荐一下，如果有误，欢迎指正，谢谢！

版权声明：此篇为本人原创，转载请标明出处：https://www.cnblogs.com/YQian/p/11323443.html

我的博客园地址：https://www.cnblogs.com/YQian/

转载于:https://www.cnblogs.com/YQian/p/11323443.html