您的位置：首页 > Web前端 > JavaScript

使用iframe实现，点击JSP页面中的验证码刷新

2011-09-04 08:08 621 查看

本功能主要采用JSP页面生成验证码，通过原始JavaScript+iframe实现页面刷新。步骤如下：

1、验证码生成页面ValiCode.jsp：

<%@ page language="java" import="java.util.*,java.io.*,com.sun.image.codec.jpeg.*,java.awt.*,java.awt.image.*" pageEncoding="GB18030"%>
<%
String s="";
int count=0;
Random rand=new Random();
count=rand.nextInt(9999);
while(count<1000){
count=rand.nextInt(9999);
}
s+=count;
session.setAttribute("validate",s);
response.setContentType("image/gif");
BufferedImage image=new BufferedImage(65,30,BufferedImage.TYPE_INT_RGB);
Graphics gra=image.getGraphics();
gra.setColor(Color.RED);
gra.fillRect(1,1,63,28);
gra.setColor(Color.ORANGE);
gra.setFont(new Font("隶书",Font.PLAIN,28));
char c;
for(int i=0;i<4;i++){
c=s.charAt(i);
gra.drawString(c+" ",i*15+4,23);
}
OutputStream toClient=response.getOutputStream();
JPEGImageEncoder jpg=JPEGCodec.createJPEGEncoder(toClient);
jpg.encode(image);
toClient.close();
out.clear();
out=pageContext.pushBody();

%>

2、设定刷新页面code.jsp：

主要引入验证码图片，点击时刷新。

<html>
<head>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<script language="javascript">
function showVali()
{
history.go(0) ;

}
</script>
</head>

<body>
<img src="/company/ValiCode.jsp" onClick="showVali()" >
</body>
</html>

3、在主题页index.jsp面使用iframe，引入验证码

<iframe id="myframe" width="65" height="30" src="/company/code.jsp" scrolling="no"></iframe>

4、点击即可实现刷新。

5、更简单的方法，在主题页index.jsp页面可以直接使用onclick实现请求刷新

<img id='imgVcode' src="ValiCode.jsp" onclick="document.getElementById('imgVcode').src = 'ValiCode.jsp?'+(new Date()).getTime()"/>

后面的时间可以改变地址，相当于发出不同的请求，页面实现刷新效果。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航