81,092
社区成员
发帖
与我相关
我的任务
分享如何用javascript实现异步刷新？
我做了一个validatecode.jsp页面，它的功能是随机产生验证码，我在我的login.jsp页面调用它，我想实现的功能是，只要单击验证图片，而不需要刷新整个页面就能重新载入validatecode.jsp产生的图片。
另外，为什么我用<html:image>标签时，单击图片时，它直接跳到了login.do页面？而<html:img>则只是生成图片？
能不能只用javascript完成，因为我不会用ajax?
这是我的代码：
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/include/taglibs.jsp"%>
<%@ include file="/include/header.html"%>
<html:html>
<head>
<html:base />
<title><bean:message key="bbs.title" />用户登录</title>
<style type="text/css">
<!--
.STYLE2 {
font-family: "宋体";
font-size: 25px;
}
.STYLE3 {font-size: 14px}
-->
</style>
</head>
<body>
<script language="javascript">
function show() {
}
function doClick(){
window.location.href="../user/register.jsp";
}
</script>
<p>
</p>
<table width="300" border="0" align="center" cellpadding="0"
cellspacing="0">
<html:form action="login.do" method="post">
<tr>
<td>
您的帐号 :
<html:text property="username" size="20" />
</td>
</tr>
<tr>
<td>
<html:errors property="username.null" />
</tr>
<tr>
<td>
您的密码 :
<html:password property="password" size="20" />
</td>
</tr>
<tr>
<td>
<html:errors property="password.null" />
</td>
</tr>
<tr>
<td>
登录期限 :
<html:select property="keeptime">
<html:option value="0">永不保存</html:option>
<html:option value="86400">保存一天</html:option>
<html:option value="604800">保存一周</html:option>
<html:option value="2592000">保存一月</html:option>
<html:option value="31536000">保存一年</html:option>
</html:select>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>
验 证 码 :
<html:text property="validatecode" size="6" />
</td>
<td width="10">
</td>
<td>
<html:image src="../include/validatecode.jsp" onclick="show()" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<html:errors property="errors.validatecode" />
</td>
</tr>
<tr>
<td>
<table align="center">
<tr>
<td width="100">
<html:submit value="登录" />
</td>
<td width="100">
<html:reset value="重填" />
</td>
<td width="100">
<html:button property="button" onclick="doClick()">
<bean:message key="bbs.register"/>
</html:button>
</td>
</tr>
</table>
</td>
</tr>
</html:form>
</table>
<%@ include file="/include/footer.html"%>
</body>
</html:html>
另外，为什么我用<html:image>标签时，单击图片时，它直接跳到了login.do页面？而<html:img>则只是生成图片？
能不能只用javascript完成，因为我不会用ajax?
这是我的代码：
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/include/taglibs.jsp"%>
<%@ include file="/include/header.html"%>
<html:html>
<head>
<html:base />
<title><bean:message key="bbs.title" />用户登录</title>
<style type="text/css">
<!--
.STYLE2 {
font-family: "宋体";
font-size: 25px;
}
.STYLE3 {font-size: 14px}
-->
</style>
</head>
<body>
<script language="javascript">
function show() {
}
function doClick(){
window.location.href="../user/register.jsp";
}
</script>
<p>
</p>
<table width="300" border="0" align="center" cellpadding="0"
cellspacing="0">
<html:form action="login.do" method="post">
<tr>
<td>
您的帐号 :
<html:text property="username" size="20" />
</td>
</tr>
<tr>
<td>
<html:errors property="username.null" />
</tr>
<tr>
<td>
您的密码 :
<html:password property="password" size="20" />
</td>
</tr>
<tr>
<td>
<html:errors property="password.null" />
</td>
</tr>
<tr>
<td>
登录期限 :
<html:select property="keeptime">
<html:option value="0">永不保存</html:option>
<html:option value="86400">保存一天</html:option>
<html:option value="604800">保存一周</html:option>
<html:option value="2592000">保存一月</html:option>
<html:option value="31536000">保存一年</html:option>
</html:select>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>
验 证 码 :
<html:text property="validatecode" size="6" />
</td>
<td width="10">
</td>
<td>
<html:image src="../include/validatecode.jsp" onclick="show()" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<html:errors property="errors.validatecode" />
</td>
</tr>
<tr>
<td>
<table align="center">
<tr>
<td width="100">
<html:submit value="登录" />
</td>
<td width="100">
<html:reset value="重填" />
</td>
<td width="100">
<html:button property="button" onclick="doClick()">
<bean:message key="bbs.register"/>
</html:button>
</td>
</tr>
</table>
</td>
</tr>
</html:form>
</table>
<%@ include file="/include/footer.html"%>
</body>
</html:html>
...全文
请发表友善的回复…
发表回复
hsbljyy 2007-10-30
- 打赏
- 举报
谢谢5楼的，这样就可以不用ajax实现异步刷新了……^_^
snow0613 2007-10-30
- 打赏
- 举报
function show(o){
// 重新载入验证码
var timenow = new Date().getTime();
o.src="include/validatecode.jsp?d="+timenow;
}
<a href="javascript:show(document.getElementById('rand'))" class="STYLE3">验证码看不清</a>
// 重新载入验证码
var timenow = new Date().getTime();
o.src="include/validatecode.jsp?d="+timenow;
}
<a href="javascript:show(document.getElementById('rand'))" class="STYLE3">验证码看不清</a>
hsbljyy 2007-10-29
- 打赏
- 举报
呵呵～谢谢两位了！
xiaokunyu 2007-10-29
- 打赏
- 举报
ajax就是用javaScript寫的，如果你自己寫的出的話，你就自己寫。和和。
不過很長很長就是勒。 有現成的干嘛不用現成的呢？
去網上查ajax吧，使用起來很簡單的。
不過很長很長就是勒。 有現成的干嘛不用現成的呢？
去網上查ajax吧，使用起來很簡單的。
tianwill 2007-10-29
- 打赏
- 举报
只能用AJAX。
AJAX其实很简单的，楼主网上搜一下AJAX要不了1个小时就能搞定。
AJAX其实很简单的，楼主网上搜一下AJAX要不了1个小时就能搞定。
hsbljyy 2007-10-29
- 打赏
- 举报
没人回答，自己顶……
JavaScript Ajax实现异步通信
一、浏览器与服务器的同步和异步通信
1.同步：是阻塞的，浏览器在向服务器发送请求之后一直等待服务器的响应，而没有做其他事情。
2.异步：非阻塞的，浏览器向服务器发送请求之后，继续执行其他代码，知道服务器响应，浏览器中断当前的任务，处理服务器响应。
二、没有Ajax之前浏览器是通过iframe来实现异步刷新
1.iframe标签：iframe标签通过src连接到一个页面，其实就是将需要实现异步刷新的内容使用
iframe标签包裹，
A.对iframe实现整个页面刷新，其实是通过刷新一个页面的子页面来实现异步刷新；
a.主页面代码：
