下面的代碼是利用Ajax實現在輸入框中寫入一個ID號，即時的從數據庫中取得數據並在頁面無刷新的情況下顯示。
Ajax.aspx的代碼：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Ajax.aspx.cs" Inherits="Activity_Ajax" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Ajax取參數</title>
<script lang="javascript">
function showHint()
{
var str = document.getElementById("txt1").value;
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url="AjaxService.aspx";
url=url+"?q="+str;
xmlHttp.onreadystatechange = updatePage;
xmlHttp.open("GET",url,true);
xmlHttp.send();
}
function GetXmlHttpObject()
{
var objXMLHttp=null;
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
// IE
objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
return objXMLHttp;
}
function updatePage()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
</script>
</head>
<body>
<form id="form1">
<div>
<input id="txt1" type="text" onkeyup="showHint()"/>
<p>參數：<span id="txtHint"></span></p>
</div>
</form>
</body>
</html>
后台什么都不需要。
這個頁面請求的頁面為AjaxService.aspx頁面。該頁面應該怎么寫呢？
其實，最好的寫法是：AjaxService.aspx什么都不要寫，只有以下這一行：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxService.aspx.cs"
Inherits="Activity_ AjaxService"%>
后台代碼為（AjaxService.aspx.cs）：
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class Activity_AjaxService : System.Web.UI.Page
{
Connection conn = new Connection();
string strSql;
protected void Page_Load(object sender, EventArgs e)
{
conn.Open();
strSql = "select * from GCGL.Parameter where id=";
string queryStr = Request.QueryString["q"];
if (queryStr != null || queryStr != "")
{
strSql = strSql + queryStr;
}
DataTable dt = conn.GetTable(strSql);
if (dt.Rows.Count > 0)
{
Response.Write(dt.Rows[0]["Content"].ToString());
}
}
}
這里用到了企業庫，但只要修改部分程序就可以運行在本機上。
下面這張圖是GCGL.Parameter表中的部分數據。
運行效果如下：
下面，再試試在AjaxService.aspx添加一些html代碼。改為：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxService.aspx.cs" Inherits="Activity_AjaxService" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
這時再運行Ajax.aspx，發現程序報錯，什么原因呢？數據的傳送是沒有問題的，因為開始的時候傳送過來了，獲取數據的代碼都在AjaxService.aspx.cs中，我們並沒有修改那里的代碼。調試程序時，也發現是JavaScript的錯誤。我們將Ajax.aspx中下面這行：
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
改為：
document.getElementById("txtHint").innerText=xmlHttp.responseText;
程序運行效果為：
我想到這里大家一定知道了什么原因：responseText屬性包含了從服務器返回的文字信息。這些信息其實就是所請求的頁面。如果包括<html></html>標簽，那么在調用某個span的innerHTML()方法時，由於<html></html>不能嵌套在<span></span>中，就會引發“未知運行期錯誤”。