📄 ajax_source.asp@output=print
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en-US" xml:lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>AJAX Source Code to Suggest Example</title>
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta name="Keywords" content="xml,tutorial,html,dhtml,css,xsl,xhtml,javascript,asp,ado,vbscript,dom,sql,colors,soap,php,authoring,programming,training,learning,beginner's guide,primer,lessons,school,howto,reference,examples,samples,source code,tags,demos,tips,links,FAQ,tag list,forms,frames,color table,w3c,cascading style sheets,active server pages,dynamic html,internet,database,development,Web building,Webmaster,html guide" />
<meta name="Description" content="Free HTML XHTML CSS JavaScript DHTML XML DOM XSL XSLT RSS AJAX ASP ADO PHP SQL tutorials, references, examples for web building." />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="cache-control" content="no-cache" />
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "../../https@ssl./default.htm" : "../../www./default.htm");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-3855518-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>
<script src="clienthint.js" type="text/javascript"></script>
<style>
<!--
div.Section1
{page:Section1;}
-->
</style>
</head>
<body>
<p>From <b>http://www.w3schools.com</b> (Copyright Refsnes Data)</p>
<h1>AJAX Suggest Source Code</h1>
<a href="ajax_example_suggest.asp"><img border="0" src="../images/btn_previous.gif" width="100" height="20" alt="Previous" /></a>
<a href="ajax_database.asp"><img border="0" src="../images/btn_next.gif" width="100" height="20" alt="Next" /></a>
<hr />
<h2>AJAX Source Code to Suggest Example</h2>
<p>The source code below belongs to the AJAX example on the previous page.</p>
<p>You can copy and paste it, and try it yourself.</p>
<hr />
<h2>The AJAX HTML Page</h2>
<p>This is the HTML page. It contains a simple HTML form and a link to a
JavaScript.</p>
<table class="ex" width="100%" border="1" id="table1"><tr><td>
<pre><html>
<head>
<script src="clienthint.js"></script>
</head>
<body></pre>
<pre><form>
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form></pre>
<pre><p>Suggestions: <span id="txtHint"></span></p> </pre>
<pre></body>
</html></pre>
</td></tr></table>
<p>
The JavaScript code is listed below.</p>
<hr />
<h2>The AJAX JavaScript</h2>
<p>This is the JavaScript code, stored in the file "clienthint.js":</p>
<table class="ex" width="100%" border="1" id="table2"><tr><td>
<pre>var xmlHttp
function showHint(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="gethint.asp";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}</pre>
</td></tr></table>
<br />
<hr />
<h2>The AJAX Server Page - ASP and PHP</h2>
<p><b>There is no such thing as an AJAX server. AJAX pages can be served by any internet server.</b><br />
</p>
<p>The server page called by the JavaScript in the example from the previous
chapter is a simple ASP file called "gethint.asp".</p>
<p>Below we have listed two examples of the server page code, one written in ASP
and one in PHP. </p>
<hr />
<h2>AJAX ASP Example</h2>
<p>The code in the "gethint.asp" page is written in VBScript for an Internet Information Server (IIS).
It just checks an array of names and returns the corresponding names to the
client:</p>
<table class="ex" width="100%" border="1" id="table5"><tr><td>
<pre><%
response.expires=-1
dim a(30)
'Fill up array with names
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"</pre>
<pre>'get the q parameter from URL
q=ucase(request.querystring("q"))</pre>
<pre>'lookup all hints from array if length of q>0
if len(q)>0 then
hint=""
for i=1 to 30
if q=ucase(mid(a(i),1,len(q))) then
if hint="" then
hint=a(i)
else
hint=hint & " , " & a(i)
end if
end if
next
end if</pre>
<pre>'Output "no suggestion" if no hint were found
'or output the correct values
if hint="" then
response.write("no suggestion")
else
response.write(hint)
end if
%></pre>
</td></tr></table>
<br />
<hr />
<h2>AJAX PHP Example</h2>
<p>The code above rewritten in PHP.</p>
<p><b>Note:</b> To run the entire example in PHP, remember to change the value
of the url variable in "clienthint.js" from "gethint.asp" to "gethint.php".</p>
<h3>PHP Example</h3>
<table class="ex" width="100%" border="1" id="table6"><tr><td>
<pre><?php
<font face="Courier New" size="2"><span lang="EN-GB" style="FONT-SIZE: 10pt; FONT-FAMILY: 'Courier New'"><span class="default">header</span><span class="keyword">(</span><span class="string">"Cache-Control: no-cache, must-revalidate"</span><span class="keyword">);
</span></span><span lang="EN-GB" style="font-size: 10pt; font-family: Courier New"><span class="keyword"> </span><span class="comment">// Date in the past</span></span><span lang="EN-GB" style="FONT-SIZE: 10pt; FONT-FAMILY: 'Courier New'"><span class="keyword">
</span><span class="default">header</span><span class="keyword">(</span><span class="string">"Expires: Mon, 26 Jul 1997 05:00:00 GMT"</span><span class="keyword">);</span>
</span></font>
// Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";</pre>
<pre>//get the q parameter from URL
$q=$_GET["q"];</pre>
<pre>//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}
// Set output to "no suggestion" if no hint were found
// or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//output the response
echo $response;
?></pre>
</td></tr></table>
<br />
<hr />
<a href="ajax_example_suggest.asp"><img border="0" src="../images/btn_previous.gif" width="100" height="20" alt="Previous" /></a>
<a href="ajax_database.asp"><img border="0" src="../images/btn_next.gif" width="100" height="20" alt="Next" /></a>
<p>From <b>http://www.w3schools.com</b> (Copyright Refsnes Data)</p>
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -