使用onsubmit事件触发ajax时返回值如何返回

WBOY

Release： 2016-06-13 13:01:33

Original

771 people have browsed it

使用onsubmit事件触发ajax时返回值怎么返回
这个是表单

<br />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br />
<title>无标题文档</title><br />
<br />
<br />
</head><br />
<br />
<body><br />
<br />
<form action="abc.php" method="post" name="form" onSubmit="return check_form()"/><br />
用户名<input type="text" name="username" id="username" /><br />
验证码<input type="text" name="identifying_code" id="identifying_code"/><br />
<input type="submit" name="login" value="登录"><br />
</form><br />
<div id="tishi"></div><br />
<script language="javascript" src="js/xmlhttprequest.js"></script><br />
<script language="javascript" src="js/js2.js"></script><br />
</body><br />
</html><br />
<br />

Copy after login

这个是xmlhttprequest.js页面

<br />
var xmlhttp = false;<br />
if (window.XMLHttpRequest) { 									//Mozilla、Safari等浏览器<br />
	xmlhttp=new XMLHttpRequest();<br />
} <br />
else if (window.ActiveXObject) { 								//IE浏览器<br />
	try {<br />
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");<br />
	} catch (e) {<br />
		try {<br />
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");<br />
	   } catch (e) {}<br />
	}<br />
}<br />

Copy after login

这个是js2.js页面里面有我标记的路线可以看到整个执行的过程。

<br />
var flag;<br />
function check_form(){<br />
		<br />
		    var username=document.getElementById('username').value;<br />
			var identifying_code=document.getElementById('identifying_code').value;<br />
			url='login_chk.php?username='+username+'&identifying_code='+identifying_code;<br />
			alert('这里第1步');<br />
			xmlhttp.open('get',url,true);<br />
			alert('这里第2步');<br />
			xmlhttp.onreadystatechange = function(){<br />
				alert('这里第5步');<br />
				if(xmlhttp.readyState == 4){<br />
					alert('这里第6步');<br />
					if(xmlhttp.status == 200){<br />
						alert('这里第7步');<br />
						msg = xmlhttp.responseText;<br />
						alert('这里第8步');<br />
<br />
						if(msg==1){<br />
							document.getElementById("tishi").innerHTML="<font color='#FF0000'>输入正确正在跳转</font>";	<br />
							flag=true;<br />
<br />
						}<br />
						else{<br />
							document.getElementById("tishi").innerHTML="<font color='#FF0000'>用户名或者密码错误</font>";<br />
							flag=false;<br />
						}<br />
						alert('这里第9步');<br />
						<br />
				    }<br />
			    }<br />
				<br />
				//alert(flag);<br />
			}<br />
			xmlhttp.send(null);<br />
			alert('这里第3步');<br />
		<br />
		<br />
		if(flag==true){<br />
		alert('这里是true');<br />
		alert(flag);<br />
		return true;<br />
		}<br />
		else {<br />
		alert('这里第4步');<br />
		alert(flag);<br />
		return false;<br />
		}<br />
<br />
}	<br />

Copy after login

这个是login_chk.php页面

<br />
<?php<br />
if(strcmp($_GET['username'],'abcd')==0&&strcmp($_GET['identifying_code'],'abcd')==0){<br />
$msg=1;<br />
<br />
}<br />
else{<br />
	$msg=0;<br />
	}<br />
<br />
echo $msg;<br />
<br />
?><br />
<br />

Copy after login

最重要的是要取得check_form的返回值，才能决定表单是否能提交。求高手更改代码取到check_form的返回值
------解决方案--------------------
xmlhttp.open('get',url,true);
这是异步通讯，所以你要定义接受返回数据的回调函数
xmlhttp.onreadystatechange = function(){