乐府诗个人博客

AJAX的典型应用（竞拍倒计时）

就以我最近做的低价竞拍活动，来简单说一下如何使用AJAX来实现异步无刷新操作吧：

Javascript:

 // 异步调用
 var xmlHttp = new ActiveXObject("Microsoft.XMLHttp");

 function sendAJAX()
 {
  xmlHttp.open("post", "Receive.aspx?endDate=" + document.getElementById("divEndDate").innerHTML, true);
  xmlHttp.send(null);
    
  // 一旦提交页面，onreadystatechange则监听服务器端数据是否返回
  // 如果返回则调用后面的函数
  xmlHttp.onReadyStateChange = setServerTime;
 }
 function setServerTime()
 {
  if(xmlHttp.readyState == 4 || xmlHttp.readyState == "complete")
  {
   var divRemainDate = document.getElementById("divRemainDate");
   divRemainDate.innerHTML = "距竞拍结束还剩：" + xmlHttp.responseText;
  }
 }
   
 setInterval("sendAJAX()", 1000);

HTML:（请去掉注释）

<!--<div id="divRemainDate">距竞拍结束还剩：</div>-->

Receive.aspx:

  private void Page_Load(object sender, System.EventArgs e)
  {
   if(this.Request.QueryString["endDate"] != null)
   {
    TimeSpan ts1 = Convert.ToDateTime(this.Request.QueryString["endDate"]) - DateTime.Now;
    if(ts1.TotalSeconds > 0)
    {
     this.Response.Write(ts1.Days.ToString() + "天" + ts1.Hours.ToString() + "小时" + ts1.Minutes + "分钟" + ts1.Seconds + "秒");
    }
    else
    {
     this.Response.Write("此次竞拍活动结束！");
    }
   }
  }

相关内容

下列内容与有着内在的联系，建议您一并阅读。