AJAX - 查询请求实例 - 3个页面
clienthint.js AJAX服务响应页面
//----------------------------------------------------------------------- //服务器响应过程函数showHint(str) //------------------------------------------------------------------------ var xmlHttp; function showHint(str){ //判断表单输入内容--------------------------------------------- if (str.length==0){ document.getElementById("txtHint").innerHTML=""; return; } //打开浏览器判断函数---------------------------------------- xmlHttp=GetXmlHttpObject(); if (xmlHttp==null){ alert ("您的浏览器不支持AJAX!"); return; } //打开服务器响应过程函数-------------------------------------- xmlHttp.onreadystatechange=stateChanged; function stateChanged() { if (xmlHttp.readyState==4){ document.getElementById("txtHint").innerHTML=xmlHttp.responseText; } } //象服务器请求响应--------------------- var url="gethint.asp"; url=url+"?q="+encodeURIComponent(str); xmlHttp.open("GET",url,true); xmlHttp.send(null); } //----------------------------------------------------------------------- //判断浏览器是否支持AJAX函数---通用函数 //------------------------------------------------------------------------ function GetXmlHttpObject() { var xmlHttp=null; try { xmlHttp=new XMLHttpRequest(); } catch (e) { try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } //-------------------------------------------------------------------------
index.asp 提交页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script src="clienthint.js"></script> </head> <body> <form> 查询姓名:<input type="text" id="txt1" onkeyup="showHint(this.value)" /> </form> <p>你查的结果: <span id="txtHint"></span></p> </body> </html>
gethint.asp ASP处理页面
<% response.expires=-1 '不缓存 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)="我me+%&" a(27)="Elizabeth" a(28)="我" a(29)="Wenche" a(30)="Wenche" '从URL取得参数q---------------------------------------- q=ucase(request.querystring("q")) '判断输入--------------------------------------------- '如果q的长度大于0,则查找所有的hint 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 '或者输出正确的值 if hint="" then response.write("找不到此用户") else response.write (hint) end if %>
按字母顺序浏览:A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
→我们致力于为广大网民解决所遇到的各种电脑技术问题 如果您认为本词条还有待完善,请 编辑词条