AJAX Example - AJAX Source
AJAX 实例 - AJAX 源码

The source code below belongs to the AJAX example on the previous page.
下面的源代码是前一个页面的。

You can copy and paste it, and try it yourself.
你可以将它复制并粘贴,自己来尝试。


The AJAX HTML Page
AJAX HTML页面

This is the HTML page. It contains a simple HTML form and a link to a JavaScript.
这是一个HTML网页。它包括了一个简单的HTML表单和关联JS的link

<html>
            <head>
            <script src="clienthint.js"></script>
            </head>
<body>
<form>
            First Name:
            <input type="text" id="txt1"
            onkeyup="showHint(this.value)">
            </form>
<p>Suggestions: <span id="txtHint"></span></p> 
</body>
            </html>

The JavaScript code is listed below.
JS代码在下面


The AJAX JavaScript
AJAX 的 JS

This is the JavaScript code stored in the file "clienthint.js":
这是JS代码,被保存在"clienthint.js"文件中

var xmlHttp
            function showHint(str)
            {
            if (str.length > 0)
            {
            var url="gethint.asp?sid=" + Math.random() + "&q=" + str
            xmlHttp=GetXmlHttpObject(stateChanged)
            xmlHttp.open("GET", url , true)
            xmlHttp.send(null)
            }
            else
            {
            document.getElementById("txtHint").innerHTML=""
            }
            }
            function stateChanged()
            {
            if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
            {
            document.getElementById("txtHint").innerHTML=xmlHttp.responseText
            }
            }
            function GetXmlHttpObject(handler)
            {
            var objXmlHttp=null
            if (navigator.userAgent.indexOf("Opera")>=0)
            {
            alert("This example doesn't work in Opera")
            return;
            }
            if (navigator.userAgent.indexOf("MSIE")>=0)
            {
            var strName="Msxml2.XMLHTTP"
            if (navigator.appVersion.indexOf("MSIE 5.5")>=0)
            {
            strName="Microsoft.XMLHTTP"
            }
            try
            {
            objXmlHttp=new ActiveXObject(strName)
            objXmlHttp.onreadystatechange=handler
            return objXmlHttp
            }
            catch(e)
            {
            alert("Error. Scripting for ActiveX might be disabled")
            return
            }
            }
            if (navigator.userAgent.indexOf("Mozilla")>=0)
            {
            objXmlHttp=new XMLHttpRequest()
            objXmlHttp.onload=handler
            objXmlHttp.onerror=handler
            return objXmlHttp
            }
            } 


The AJAX Server Page
AJAX 服务端页面

The server paged called by the JavaScript, is a simple ASP file called "gethint.asp".
服务端页面被JS所调遣,是一名为"gethint.asp"的ASP文件

The page is written in VBScript for an Internet Information Server (IIS). It could easily be rewritten in PHP, or some other server language.
页面是用VBS来针对IIS所写的。它可以被轻松的写成PHP或是一些其他的服务语言

It just checks an array for names and returns corresponding names to the client:
它只是检查了名字组并将相吻合的名字返回给客户端:

dim a(30)
            a(1)="Anna"
            a(2)="Brittany"
            a(3)="Cinderella"
            a(4)="Diana"
            a(5)="Eva"
            a(6)="Fiona"
            a(7)="Gunda"
            a(8)="Hege"
            a(9)="Inga"
            a(10)="Johanna"
            a(11)="Kitty"
            a(12)="Linda"
            a(13)="Nina"
            a(14)="Ophelia"
            a(15)="Petunia"
            a(16)="Amanda"
            a(17)="Raquel"
            a(18)="Cindy"
            a(19)="Doris"
            a(20)="Eve"
            a(21)="Evita"
            a(22)="Sunniva"
            a(23)="Tove"
            a(24)="Unni"
            a(25)="Violet"
            a(26)="Liza"
            a(27)="Elizabeth"
            a(28)="Ellen"
            a(29)="Wenche"
            a(30)="Vicky"
            q=request.querystring("q")
if len(q)>0 then
            hint=""
            for i=1 to 30
            x1=ucase(mid(q,1,len(q)))
            x2=ucase(mid(a(i),1,len(q)))
            if x1=x2 then
            if hint="" then
            hint=a(i)
            else
            hint=hint & " , " & a(i)
            end if
            end if
            next
            end if
            if hint="" then
            response.write("no suggestion")
            else
            response.write(hint)
            end if