初学ajax遇到的问题

[cnicc]

一个表单里面，放了一个文本框，通过get方式将值传到get.php处理。由于处理过程比较卡，所以用了一个loading的图片等待

但是当我将我将文本框填入“11111”，点击提交按钮时，页面没反映，url却指向为http://******/index.html?user=11111

相关代码如下



index.html主要代码


<form name="form1" id="form1" method="get" >
<p align="center">
<input type="text" size="32" id="user" name="user" />

<input type="submit" value="查询" onClick="showData()" />
</p>
</form>

<div id="data"></div>

<script type="text/javascript">
var xmlHttp;

//创建一个xmlHttpRequest对象
function createXMLHttpRequest() {

if (window.ActiveXObject) {

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

else if (window.XMLHttpRequest) {

xmlHttp = new XMLHttpRequest();

}

}

function handleStateChange(){

var img = " <img src='a.gif' style='margin-top:130px; margin-left:250px'>";

if(xmlHttp.readystate == 4){ //表示请求状态 4为完成

if(xmlHttp.status == 200){ //http状态指示码，200表示ok

//将服务器返回信息作为文本插入到DIV容器中。

document.getElementById("data").innerHTML = xmlHttp.responseText;

}

}

else document.getElementById("data").innerHTML = img;
//若响应未完成的话，则显示loading..

}


function showData(){
var user=document.getElementById("user").value;

var url = "/get.php?user="+user;

createXMLHttpRequest();

//请求状态改变事件触发handleStateChange功能

xmlHttp.onreadystatechange = handleStateChange;

xmlHttp.open("GET",url);

xmlHttp.send(null);

}

</script>

[moodboy1982]

你初学AJAX，不要分成这么多函数，不方便你调试。
给你参考，首先第一个函数可以这样：

function CreateHttpRequest()
{
  try {xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");}
	   catch (e) {
           try {xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");}
			catch (e2) {xmlHttp = false;}}

  if (!xmlHttp && typeof XMLHttpRequest != 'undefined') //判断是不是Firefox浏览等
	{
      xmlHttp = new XMLHttpRequest();
	 if (xmlHttp.overrideMimeType) 
	   {
         xmlHttp.overrideMimeType('text/xml');
       }
     }
  return xmlHttp;
}

后面两个建议你合并一下
如：

function showData(){
 var user=document.getElementById("user").value;
 var url = "/get.php?user="+user; 
 var xmlHttp = false;
 //判断浏览器
 Newurl=url+"&temp="+Math.random();  //加一个随机数，要不然所你老是取到一样的结果。
     xmlHttp=CreateHttpRequest();
	 xmlHttp.onreadystatechange = function(){
	 if (xmlHttp.readyState == 4) {
           if (xmlHttp.status == 200) {
			   message = xmlHttp.responseText; //获取XMLHTTP返回的值
			   document.getElementById("data").innerHTML=message;			
			}
		  }
           else
           {
             document.getElementById("data").innerHTML="<img src='a.gif' style='margin-top:130px; margin-left:250px'>";
             }
           }
         xmlHttp.open("get",Newurl,true);
	 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	 xmlHttp.send(null);
}

[moodboy1982]

如果你JS用得多，我建议你可以考虑一下用：Jquery框架。

[mumu_java]

lz的错误原因是open和onreadystatechange的顺序发生了错误.参看下边代码.

function showData(){ 
        var user=document.getElementById("user").value; 

        var url = "/get.php?user="+user; 

      createXMLHttpRequest(); 

      xmlHttp.open("GET",url);
        //请求状态改变事件触发handleStateChange功能 

       xmlHttp.onreadystatechange = handleStateChange;  
      xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");//如果有问题,这句可以去掉.
      xmlHttp.send(null);  

      } 

[cnicc]

按照3楼的改法，那个loading图片能出来，但是之后还是跳到了http://****/index.htm?user=******
我想跳转到的是http:///***/get.php?user=****

[cnicc]

我解决了，把最后一个表单 type=submit 改成 type=botton 就可以了

=========================
最后页面显示 “Array”
不知道是不是我get.php程序问题，还是以上代码有所欠缺

=========================
感谢楼上两位