AJAX ASP/PHP 实例
AJAX 用于创造动态性更强的应用程序。
AJAX ASP/PHP 实例
下面的例子将为您演示当用户在输入框中键入字符时,网页如何与 web 服务器进行通信:
请在下面的输入框中键入字母(A – Z):
实例
在输入框中尝试输入字母 a:
输入姓名:
提示信息:
实例解析 – showHint() 函数
当用户在上面的输入框中键入字符时,会执行函数 \”showHint()\” 。该函数由 \”onkeyup\” 事件触发:
function showHint(str)
{
var xmlhttp;
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","/try/ajax/gethint.php?q="+str,true);
xmlhttp.send();
}
源代码解析:
如果输入框为空 str.length==0,则该函数清空 txtHint 占位符的内容,并退出函数。
如果输入框不为空,showHint() 函数执行以下任务:
- 创建 XMLHttpRequest 对象
- 当服务器响应就绪时执行函数
- 把请求发送到服务器上的文件
- 请注意我们向 URL 添加了一个参数 q (带有输入框的内容)
AJAX 服务器页面 – ASP 和 PHP
由上面的 JavaScript 调用的服务器页面是 ASP 文件,名为 "gethint.asp"。
下面,我们创建了两个版本的服务器文件,一个用 ASP 编写,另一个用 PHP 编写。
ASP 文件
\”gethint.asp\” 中的源代码会检查一个名字数组,然后向浏览器返回相应的名字:
<%
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\"
\'get the q parameter from URL
q=ucase(request.querystring(\"q\"))
\'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
\'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
%>
PHP 文件
下面的代码用 PHP 编写,与上面的 ASP 代码作用是一样的。
<?php
// 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\";
//get the q parameter from URL
$q=$_GET[\"q\"];
//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;
?>
点我分享笔记