我们利用上面的ajax开发框架来做两个简单的应用
在<body></body>之间增加一段form表单代码:
<form name="form1" action="" method="post">
用户名:<input type="text" name="username" value="">
<input type="button" name="check" value="唯一性检查" onClick="[color=red]userCheck[/color]()">
<input type="submit" name="submit" value="提交">
</form>
在开发框架的基础上再增加一个调用函数:
function userCheck() {
var f = document.form1;
var username = f.username.value;
if(username=="") {
window.alert("用户名不能为空。");
f.username.focus();
return false;
}
else {
[color=red]send_request[/color]('sample1_2.jsp?username='+username);
}
}
看看sample1_2.jsp做了什么:
<%@ page contentType="text/html; charset=gb2312" errorPage="" %>
<%
String username = request.getParameter("username");
if("educhina".equals(username)) out.print("用户名已经被注册,请更换一个用户名。");
else out.print("用户名尚未被使用,您可以继续。");
%>
在<body></body>之间增加一段form表单代码:
<form name="form1" action="" method="post">
用户名:<input type="text" name="username" value="">
<input type="button" name="check" value="唯一性检查" onClick="[color=red]userCheck[/color]()">
<input type="submit" name="submit" value="提交">
</form>
在开发框架的基础上再增加一个调用函数:
function userCheck() {
var f = document.form1;
var username = f.username.value;
if(username=="") {
window.alert("用户名不能为空。");
f.username.focus();
return false;
}
else {
[color=red]send_request[/color]('sample1_2.jsp?username='+username);
}
}
看看sample1_2.jsp做了什么:
<%@ page contentType="text/html; charset=gb2312" errorPage="" %>
<%
String username = request.getParameter("username");
if("educhina".equals(username)) out.print("用户名已经被注册,请更换一个用户名。");
else out.print("用户名尚未被使用,您可以继续。");
%>