Ajax简单的异步问题【异步老刷新】???
三个页面:ajax.js / ajax.php / index.php
ajax.js
ajax.php
index.php
问题是点击index.php的提交按钮,在txtHint的地方只显示一下就马上又刷新了,是怎么回事?
谁有更好的ajax异步思路,望不吝赐教!
ajax.js
/**
* 初始化一个xmlhttp对象
*/
function InitAjax()
{
var ajax=false;
try {
ajax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajax = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest();
}
return ajax;
}
///////////////////////////////////////////
function showHint()
{
//获取接受返回信息层
var msg = document.getElementById("txtHint");
//获取表单对象和用户信息值
var f = document.userlogin;
var UserName = f.UserName.value;
var UserAge = f.UserAge.value;
//接收表单的URL地址
var url = "/ajax.php";
//需要POST的值,把每个变量都通过&来联接
var postStr = "&user_name="+ UserName +"&user_age="+ UserAge;
//实例化Ajax
var ajax = InitAjax();
//通过Post方式打开连接
ajax.open("POST", url, true);
//定义传输的文件HTTP头信息
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//发送POST数据
ajax.send(postStr);
//获取执行状态
ajax.onreadystatechange = function() {
//如果执行状态成功,那么就把返回信息写到指定的层里
if (ajax.readyState == 4 && ajax.status == 200) {
msg.innerHTML = ajax.responseText;
}
}
}
ajax.php
<?php
//require("class.php");
$UserName=$_post['user_name'];
$UserAge=$_post['user_age'];
//$cd=new controldata();
//$cd->update(&$UserName,&$UserAge,&$con);
$hint=$UserName.$UserAge;
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//output the response
echo $response;
?>
index.php
<link rel="stylesheet" type="text/css" href="css.css" />
<script src="ajax.js"></script>
<?php
echo "<form method=post name=userlogin id=userlogin>UserName:<select name=UserName id=UserName><option value=aaa>aaa</option><option value=bbb>bbb</option></select>UserAge:<input type=text name=UserAge id=UserAge><input type=submit value=提交 onclick='showHint()'></form>";
echo "<div id=txtHint style='width:200px; height:30px; background:#ccc;'></div>";
?>
问题是点击index.php的提交按钮,在txtHint的地方只显示一下就马上又刷新了,是怎么回事?
谁有更好的ajax异步思路,望不吝赐教!
...全文
相关推荐
bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法
主要介绍了bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法,需要的朋友可以参考下
ajax异步 网页无刷新
ajax获取流程 html页面元素添加点击事件方法,js获取参数 php判断 数据库取值 最后返回给js js拼接字符串到页面显示,
简单的ajax异步验证,局部刷新
不涉及数据库,就是给定一个字符串验证这个字符串是否可用,一个简单的一步验证
JSP中使用Ajax完美实现异步无刷新数据分页
JSP中使用Ajax完美实现异步无刷新数据分页
php ajax 实现局部刷新简单例子(超简单化)
php ajax 实现局部刷新简单例子(超简单化)


基础编程
