一个关于ajax的提交问题

cc_com 2008-07-09 10:30:18


<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>会员注册</title>
<script type="text/javascript">
function cheked(){
var txtname=document.insert.txtname.value.length;
if(txtname==0){
alert("用户名不能为空!");
return false;
}
}


var req;
function validate() {
var idField = document.getElementById("userid");
var url = "AjaxValidate.jsp?id=" + escape(idField.value);
if(window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = callback;
req.send(null);
}

function callback() {
if(req.readyState == 4) {
if(req.status == 200) {
//alert(req.responseText);
var msg = req.responseXML.getElementsByTagName("msg")[0];
//alert(msg);
setMsg(msg.childNodes[0].nodeValue);
}
}
}

function setMsg(msg) {
//alert(msg);
mdiv = document.getElementById("usermsg");

if(msg == "yes") {
mdiv.innerHTML = "<font style='font-size: 12px;' color='#FFFF00'>很遗憾,该帐号已经被注册,请您另选一个 </font>";
}else if(msg=="no"){
mdiv.innerHTML = "<font style='font-size: 12px;' color='#66FFFF'>恭喜,该用户名可以使用 </font>";
}
if(document.insert.txtname.value==""){
mdiv.innerHTML = "<font style='font-size: 12px;' color='#FFFF00'>注册帐号不能为空 </font>";
}
}

</script>

<style type="text/css">
<!--
body {
background-color: #22578B;
}
-->
</style>
</head>

<body>
<div align="center">
<div><%@include file="includ/cn_head.jsp" %></div>
<form name="insert" action="servlet/RegisterServlet.html" method="post" onSubmit="this.regsubmit.disabled=true;">
<ul style="list-style:none; width:70%">
<li style="margin:6px;font-size: 13px;color: #FFFFFF">* 用户名:<input type="text" name="txtname" style=" width:200px" onBlur="validate()" id="userid"><br><br><span id="usermsg"></span></li>
<li style="margin:6px;font-size: 13px;color: #FFFFFF">* 密     码:<input type="password" name="pwdname" style=" width:200px"></li>
<li style="margin:6px;font-size: 13px;color: #FFFFFF">* 昵     称:<input type="text" name="txtpet" style=" width:200px"></li>
<li style="margin:6px;font-size: 13px;color: #FFFFFF">* 电     话:<input type="text" name="txtOther" style=" width:200px"></li>
<li style="margin:6px;font-size: 13px;color: #FFFFFF">* 头     像:<input type="radio" name="head" value="1" /><img src="images/head/1.gif"></img>
<input type="radio" name="head" value="2" /><img src="images/head/2.gif"></img>
<input type="radio" name="head" value="3" /><img src="images/head/3.gif"></img>
<input type="radio" name="head" value="4" /><img src="images/head/4.gif"></img>
<input type="radio" name="head" value="5" /><img src="images/head/5.gif"></img>
<input type="radio" name="head" value="6" /><img src="images/head/6.gif"></img></li>
<script>
document.all.head[0].click();
</script>
<li style="margin:6px;font-size: 13px;color: #FFFFFF"> <input type="submit" name="regsubmit" value="注册" onclick="return cheked()">         
<input type="reset" name="Submit2" value="重置"></li>
<li><img src="images/top-login.gif"/></li>
</ul>
</form>
<div><%@include file="includ/cn_foot.jsp" %></div>
</div>
</body>
</html>




一个关于ajax的提交问题,这个页面我是模仿现在比较流行的注册页面做的,当然没人家专业了,但还是凑活着用吧!
可有个问题哦,当失去焦点的时候就开始验证用户名是否注册,这个是可以实现的,可当我点击提交的时候依然是可以实现注册。。。。有什么办法可以实现验证帐号已经被注册后无法提交?
...全文
114 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
sean_xxrs 2008-07-11
  • 打赏
  • 举报
回复
function setMsg(msg) {
//alert(msg);
mdiv = document.getElementById("usermsg");

if(msg == "yes") {
mdiv.innerHTML = "<font style='font-size: 12px;' color='#FFFF00'>很遗憾,该帐号已经被注册,请您另选一个 </font>";
return false;
}else if(msg=="no"){
mdiv.innerHTML = "<font style='font-size: 12px;' color='#66FFFF'>恭喜,该用户名可以使用 </font>";
return true;
}
if(document.insert.txtname.value==""){
mdiv.innerHTML = "<font style='font-size: 12px;' color='#FFFF00'>注册帐号不能为空 </font>";
return false;
}
}

function callback() {
if(req.readyState == 4) {
if(req.status == 200) {
//alert(req.responseText);
var msg = req.responseXML.getElementsByTagName("msg")[0];
//alert(msg);
var Stuart = varsetMsg(msg.childNodes[0].nodeValue);
return Stuart;
}
}
return false;
}

function validate() {
var idField = document.getElementById("userid");
var url = "AjaxValidate.jsp?id=" + escape(idField.value);
if(window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = callback;
req.send(null);
return req.onreadystatechange;
}

function cheked(){
var txtname=document.insert.txtname.value.length;
if(txtname==0){
alert("用户名不能为空!");
return false;
}
if(validate()){
insert.submit();
}else {
alert("没有通过验证");
}
}
<form name="insert" action="servlet/RegisterServlet.html" method="post" >
<button name="regsubmit" onclick="cheked()">注册</button>
neo_yoho 2008-07-10
  • 打赏
  • 举报
回复
提交的时候多个判断
既然req为全局变量 那么可以判断req的状态是否完成
没有完成的时告诉用户等待(如果想让程序自动等待会麻烦点)
完成时可以通过判断req.responseXML.getElementsByTagName("msg")[0]的值来决定是否继续提交
asdfgh_5982 2008-07-10
  • 打赏
  • 举报
回复
[Quote=引用 2 楼 zz_fish 的回复:]
<input type="submit" name="regsubmit"id="regsubmit"value="注册" onclick="return cheked()">


function callback() {
if(req.readyState == 4) {
if(req.status == 200) {
//alert(req.responseText);
var msg = req.responseXML.getElementsByTagName("msg")[0];
//alert(msg);
setMsg(msg.childNodes[0].nodeValue);
// upon successful registration
if (msg.indexOf("已经被注册") == -1) {
document.getEl…

[/Quote]
就楼上的,不过最好能设置一个标量,以便在其他验证事件中能判断将注册按钮激活
zz_fish 2008-07-10
  • 打赏
  • 举报
回复
<input type="submit" name="regsubmit" id="regsubmit" value="注册" onclick="return cheked()">



function callback() {
if(req.readyState == 4) {
if(req.status == 200) {
//alert(req.responseText);
var msg = req.responseXML.getElementsByTagName("msg")[0];
//alert(msg);
setMsg(msg.childNodes[0].nodeValue);
// upon successful registration
if (msg.indexOf("已经被注册") == -1) {
document.getElementById("regsubmit").disabled = true;
}
}
}
}

52,799

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 Ajax
社区管理员
  • Ajax
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧