java实现动态验证码源代码——jsp页面

来源：互联网发布：dns协议使用什么端口编辑：程序博客网时间：2024/05/24 05:27

我们通常在其他网站注册或者登陆的时候会发现一个很高大上的验证码，那么怎么用java代码实现呢？下面我给大家贴一下我写的方法：

此文章是写的前台jsp页面的代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><%@ taglib uri="/struts-tags" prefix="s" %><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %><%String tag=request.getParameter("tag");request.setAttribute("tag",tag); %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <base href="<%=basePath%>">        <title>用户登录</title>    <meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0">    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><link href="<%=basePath%>css/common.css" rel="stylesheet" type="text/css" /><link href="<%=basePath%>css/style.css" rel="stylesheet" type="text/css" /><script type="text/javascript" src="js/jquery-1.8.3.js"></script><script type="text/javascript">$(function(){if(${tag == 'nologin'}){alert("对不起，您还没有登录,请先进行登录");}});</script><script type="text/javascript" >$(function(){//注册$("#register").click(function(){location.href="register.jsp";});//验证码$("#changeCode").click(function(event){$("#validateCode").attr("src","Number.jsp?ran"+Math.random());event.preventDefault();return false;});//判断验证码输入是否正确 $("#passwords").blur(function(){$.post("doNumrand.jsp","inputCode="+$("#passwords").val(),function(result){if($.trim(result)=="true"){$("#cl").html("<span style='color:green'>验证码正确</span>");}else{$("#cl").html("<span style='color:red'>验证码错误</span>");}});}); });</script><script type="text/javascript"><%String msg = request.getParameter("msg");if("registerSuccess".equals(msg)){out.print("alert('注册成功，系统将自动跳转登录页');");}if("loginError".equals(msg)){out.print("alert('用户名密码错误，请重新登录');");}if("validateCodeError".equals(msg)){out.print("alert('验证码错误，请重新输入');");}%></script>  </head>  <body><div class="wrap"><!-- main begin--> <div class="main">   <div class="sidebar">     <p><img src="images/img1.jpg" width="443" height="314" alt="" /></p>   </div>   <div class="sidebarg">     <form action="login.action" method="post">    <div class="login">      <span style="color:red"><s:property value="msg"/></span>      <dl>        <dt class="blues">用户登陆</dt>        <dd><label for="name">用户名：</label>        <input type="text" name="auctionuser.username" class="inputh" value="${username}" id="name"/></dd>        <dd><label for="password">密 码：</label>        <input type="password" name="auctionuser.userpassword" class="inputh" value="${userpassword}" id="password"/></dd>        <dd>           <label class="lf" for="passwords">验证码：</label>           <input type="text" name="inputCode" class="inputh inputs lf" value="" id="passwords"/>           <span class="wordp lf"><img id="validateCode" src="Number.jsp" width="96" height="27" alt="" /></span>           <span class="blues lf"><a id="changeCode" href="javascript:void(0);" title="">看不清</a>    <a id="cl"></a></span>        </dd>        <dd>           <input name=""  type="checkbox" id="rem_u"  />           <span class="rem_u">下次自动登录</span>        </dd>        <dd class="buttom">           <input name="" type="submit" value="登 录" class="spbg buttombg f14 lf" />           <input id="register" name="" type="button" value="注 册" class="spbg buttombg f14 lf" />           <span class="blues  lf"><a href="" title="">忘记密码?</a></span>           <div class="cl"></div>        </dd>             </dl>    </div>    </form>   </div>  <div class="cl"></div> </div><!-- main end--> <!-- footer begin--></div> <!--footer end--></body></html>

在这里主要是使用的ajax的方法，当鼠标离开输入验证码的文本框时，进行验证是否输入正确！！

1 0