asp中实现AJAX例子

function Trim(){
 return this.replace(//s+$|^/s+/g,"");
}
String.prototype.Trim=Trim; //过滤两端空格

function getObject(elementId) {  //获取指定id的object
 if (document.getElementById) {
  return document.getElementById(elementId);
 } else if (document.all) {
  return document.all[elementId];
 } else if (document.layers) {
  return document.layers[elementId];
 }
}

function getObjValue(elementId){ //获取指定id的form组件的值
 if(getObject(elementId).value!=undefined)
  return getObject(elementId).value.Trim();
 else
  return "";
}

function XHR(){ //创建XMLHttpRequest对象
 var xhr;
 try{
  xhr=new XMLHttpRequest();
 }catch(e){
      var a=['MSXML2.XMLHTTP.5.0','MSXML2.XMLHTTP.4.0','MSXML2.XMLHTTP.3.0','MSXML2.XMLHTTP','MICROSOFT.XMLHTTP.1.0','MICROSOFT.XMLHTTP.1','MICROSOFT.XMLHTTP'];
      for (var i=0;i<a.length;i++){
         try{
           xhr = new ActiveXObject(a[i]);
           break;
         }catch(e){}
      }
   }
 return xhr;
}

function checkForm(){ //表单的检测
 if(getObjValue("username")==""||getObjValue("content")==""){
  alert("请把带*号的项填写完整！");
  return false;
 }
 if(getObjValue("username").length>20){
  alert("你的名字也太长了吧？不要大于20哦");
  return false;
 }
 if(getObjValue("qq")!="" && !/^[0-9]{5,10}$/.test(getObjValue("qq"))){
  alert("腾讯好像还没有这个qq号吧？");
  return false;
 }
 if(getObjValue("email")!="" && !/^/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*$/.test(getObjValue("email"))){
  alert("换个邮箱吧，这个不合适哦！");
  return false;
 }
 return true;
}

function sendJS() { //发送留言
 var xhr=XHR();
 if(xhr&&checkForm()){
  getObject("submit").value="Sending...";
  getObject("submit").disabled=true;
  
  xhr.open("POST", "AddBook.asp", true);
  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  var aIdArray=new Array("flag="+Math.random());
  var argLen=arguments.length;
  for(i=0;i<argLen;i++){
   aIdArray[i+1]="&"+arguments[i]+"="+escape(getObjValue(arguments[i]));
  }
     var data =aIdArray.join('');
  xhr.onreadystatechange=function(){
   if(xhr.readyState==4){
    if(xhr.status==200){
     alert(unescape(xhr.responseText)); //输出返回信息，成功返回“留言成功”

     getObject("submit").value="Send It"; //禁用发送表单，防止重复提交
     getObject("submit").disabled=false;

     clearForm();    //清除表单的值
     addNew();    //更新留言
    }else{
     alert("网络传输错误！请重试！"); 
    }
   } 
  };
      xhr.send(data);
   }
}

function clearForm(){ //清空表单的函数
 getObject("username").value="";
 getObject("qq").value="";
 getObject("email").value="";
 getObject("content").value="";
}

function addNew(){ //更新留言，实质上是重新去服务器提取第一页的留言
 getList(1); 
}

function makBookStr(username,sex,qq,email,content,pubdate){ //创建一条留言的文本串
 if((email=unescape(email))!="不告诉你"){
  email='<a href="mailto:'+email+' " title="'+email+'">给我写信</a>';
 }
 var tempStr='<div class="note">/
   <div class="sexName"><div class="sex">'+sex+'</div><strong>昵称：</strong>'+unescape(username)+'</div>/
   <div class="userInfo"><strong>QQ：</strong>'+unescape(qq)+' <strong>E-mail：</strong>'+email+'  <strong>发表时间：</strong>'+pubdate+'</div>/
   <div class="content">/
    <strong>留言内容：</strong>/
    <p>'+unescape(content)+'</p>/
   </div>/
  </div>';
 return tempStr;
}

function writeBookArr(Str){ //输出服务器返回的留言内容
 if(Str!=0){
  var bookList=eval("new Array("+Str+")");
  var allStr="";
  for(var i=0;i<bookList.length;i++){
   allStr+=makBookStr(bookList[i].username,bookList[i].sex,bookList[i].qq,bookList[i].email,bookList[i].content,bookList[i].pubdate); 
  }
 }else{
  allStr="<div style='color:#f00;text-align:center;border:1px solid #d3d3d3;line-height:50px;margin-top:10px;'>暂时还没有留言！</div>"
 }
 getObject("bookList").innerHTML=allStr;
}

function getList(page){ //获取指定页的留言
 getObject("bookList").innerHTML="<div id=/"wait/">留言加载中....请稍后!</div>"; //清除原来显示的内容
 var xhr=XHR();
 xhr.open("GET", "getRecord.asp?page="+page+"&r="+Math.random(), true);
 xhr.onreadystatechange=function(){
  if(xhr.readyState==4){
   if(xhr.status==200){
    writeBookArr(xhr.responseText);
    getPage(); //更新分页信息
   }else{
    alert("获取留言失败！请刷新重试！"); 
   }
  }
  
 }
 xhr.send(null);
}

function getPage(){ //更新分页信息
 getObject("pageList").innerHTML="<div id=/"wait/">分页信息加载中....请稍后!</div>"; //清除原来显示的内容
 var xhr=XHR();
 xhr.open("GET", "getRecord.asp?act=getPageInfo&r="+Math.random(), true);
 xhr.onreadystatechange=function(){
  if(xhr.readyState==4){
   if(xhr.status==200){
    //Result=记录数|每页记录数|页数|当前页
    var Result=xhr.responseText.split("|");
    var tempPageStr=new Array("<div>共有<span class=/"tip/">"+Result[0]+"</span>条留言 每页<span class=/"tip/">"+Result[1]+"</span>条留言 当前第<span class=/"tip/">"+Result[3]+"/"+Result[2]+"</span>页 转向第<select name=/"page/" οnchange=/"getList(this.value)/" style=/"width:50px;/">");
    for(var i=1;i<=Result[2];i++){
     if(i!=Result[3])
      tempPageStr[i]="<option value=/""+i+"/">"+i+"</option>";
     else
      tempPageStr[i]="<option selected=/"selected/" value=/""+i+"/">"+i+"</option>";
    }
    tempPageStr[i]="</select>页</div>";
    var ResultStr=tempPageStr.join('');
    getObject("pageList").innerHTML=ResultStr;
   }else{
    alert("获取分页信息失败！请刷新重试！"); 
   }
  }
  
 }
 xhr.send(null);
}

function changeStyle(id){ //切换样式
 var stylesheet=getObject("color").href="color/color"+id+".css";
 document.cookie="stylesheet="+escape(stylesheet); //写入Cookie
}

function initStyle(){ //初始化样式，如果cookie存在样式，则加载cookie样式，否则加载默认样式
  if(/stylesheet=([^;]+)/.test(document.cookie))
   getObject("color").href=unescape(RegExp.$1);
}
initStyle(); //加载初始化样式