Ajax基础代码

Ajax基础代码

ajax.js


// 声明XMLHttpRequest对象
var  xmlHttp;

// 该方法可以复制被使用
//
创建XMLHttpRequest对象
funciton createXMLHttp()
{
    
if(window.XMLHttpRequest) 
    
{
       xmlHttp 
= new XMLHttpRequest();//mozilla浏览器
    }    
    
else if(window.ActiveXObject)
    
{
      
try
      
{
           xmlHttp 
= new ActiveXObject("Msxml2.XMLHttp");//旧IE版本
      }catch(e){}
      
try
      
{
           xmlHttp 
= new ActiveXObject("Microsoft.XMLHttp");//新IE版本
      }catch(e){}        
     }

     
if(!xmlHttp)
     
{
        window.alert(
"对不起!无法创建XMLHttpRequest对象");
        
return false;
     }

}


// 执行检查用户的回调函数
//
数据发送给服务器之后,会使用改函数检查是
//
否发送成功
function  checkUserName()
{
    
if (xmlHttp,readyState  ==   4 ) // 判断对象状态
     {
         
if (xmlHttp.status  ==   200 ) // 信息成功返回,开始处理信息
          {
            
// 获取服务器发来的返回值,根据情况改变页面某些元素
 
            
// responseText适合小量信息,responseXML适合大量信息
             if (xmlHttp.responseText = " true " ) // 对应doRequest.aspx中的Response.Write("true");
             {
                 document.getElementById(
" imageName " ).src = " image/true.gif " ;
               
// 改变页面上一图片文件
            }
            
else
            
{
                 document.getElementById(
" imageName " ).src = " image/false.gif " ;
            }
 
         }

    }

}


// 检查用户名是否存在
//
onkeyup = "CheckName(document.getElementById('userName'))"
function  CheckName(userName)
{
    createXMLHttp();
// 创建XMLHttpRequest对象
     var  url = " doRequest.aspx?name = " + userName; // 写法很以往的页面提交没区别
    xmlHttp.open( " GET " ,url, true ); // 这个函数时间无刷新数据提交
    xmlHttp.onreadystatechange  =  checkUserName;  // 回调函数,该函数在send方法
                                                 // 提交数据之后才被执行
    xmlHttp.send( null ); // 以上步骤完成之后提交数据
}

doRequest.aspx //后台处理请求的页面,java中他可以是jspservlet
// 获取发送过来参数
String userName  =  Request.QueryString[ " name " ].Tostring();
/**/ ///对userName进行判断看是否在数据库中

// 在的话,返回“true”数据给ajax页面
Response.Write( " true " );
// 否则
Response.Write( " false " );

你可能感兴趣的:(Ajax)