ajaxsearch.htm
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> 新网页 </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="ajaxsearch.js"></script> </head> <body> <div> <input type="text" id="searchword" onkeydown="if(event.keyCode==13) AjaxSearch();" /> <input type="button" onclick="AjaxSearch();" value="搜索" /> </div> <div id="search_result" style="background:#666666;width=100"> </div> </body> </html>
ajaxsearch.asp
<!-- #include file="commond.asp" -->
<% ' commond.asp为数据库连接文件 ' function.asp中有要用到的函数CheckStr Dim Search_Word,XML_Result,rsSearch,sqlSearch Set rsSearch=Server.CreateObject("ADODB.RecordSet") ' 获取搜索关键字 Search_Word=Request("searchword") ' XML文档头 XML_Result="<?xml version=""1.0"" encoding=""utf-8""?><blogsearch>" IF Search_Word<>Empty Then ' 创建查询SQL语句 sqlSearch="SELECT log_ID,log_Title,log_Content FROM blog_Content WHERE log_Title LIKE '%"&Search_Word&"%'" ' 打开记录集 rsSearch.open sqlSearch,Conn,1,1 ' 如果没有搜索结果就产生一个结果,logid为#,标志着没有搜索结果 IF rsSearch.BOF AND rsSearch.EOF Then XML_Result=XML_Result&"<result><log_id>#</log_id><log_title /></result>" ' 循环输出搜索结果 Do While Not rsSearch.EOF XML_Result=XML_Result&"<result><log_id>"&rsSearch("log_ID")&"</log_id><log_title>"&rsSearch("log_Title")&"</log_title></result>" ' 循环输出每一个结果 rsSearch.MoveNext Loop Else ' 关键字为空,则返回无搜索结果 XML_Result=XML_Result&"<result><logid>#</logid><logtitle /></result>" End IF XML_Result=XML_Result&"</blogsearch>" ' 设置MIME Type为XML文档 Response.ContentType = "application/xml" 'Response.CharSet = "utf-8" ' 输出搜索结果 Response.Write(XML_Result) %>
ajaxsearch.js
var xmlObj = false; var xmlResult; try { xmlObj=new XMLHttpRequest; } catch(e) { try { xmlObj=new ActiveXObject("MSXML2.XMLHTTP"); } catch(e2) { try { xmlObj=new ActiveXObject("Microsoft.XMLHTTP"); } catch(e3) { xmlObj=false; } } } if (!xmlObj) { alert("XMLHttpRequest init Failed!"); }
function AjaxSearch() { var searchword; // 获取搜索关键字,并且进行URLEncode searchword=escape(document.getElementById("searchword").value); if(searchword=="") { // 如果关键字为空,则提示用户输入关键字 document.getElementById("search_result").innerHTML="<ul><li>请输入关键字!</li></ul>"; return; } // 给出提示,正在搜索 document.getElementById("search_result").innerHTML="<ul><li>正在加载,请稍候</li></ul>"; // 打开一个连接,采用POST xmlObj.open ("POST", "ajaxsearch.asp", true); // 设置请求头,表单内容格式为URLEncoded xmlObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // 设置完成请求后响应函数 xmlObj.onreadystatechange=function() { // 完成响应 if(xmlObj.readyState==4) { // 状态正常 if(xmlObj.status==200) { // 设置xmlResult为搜索结果XML文档 xmlResult=xmlObj.responseXML; // 调用AjaxShowResult()显示搜索结果 AjaxShowResult(); } } } // 发送请求,内容为搜索的关键字 xmlObj.send("searchword="+searchword); }
function AjaxShowResult() { var results,i,strTemp; // 获取搜索结果集合 results=xmlResult.getElementsByTagName("result"); // 用无序列表来显示搜索结果 strTemp="<ul>"; // 首先判断搜索结果是否为空 if(results[0].getElementsByTagName("log_id")[0].firstChild.data=="#") // 是空,则显示没有符合的搜索结果 strTemp=strTemp+"<li>无搜索结果</li>"; else // 循环输出每个搜索结果 for(i=0;i<results.length;i++) strTemp = strTemp + "<li><a href='blogview.asp?log_ID=" + results[i].getElementsByTagName("log_id")[0].firstChild.data + "'>" + results[i].getElementsByTagName("log_title")[0].firstChild.data + "</a></li>"; strTemp=strTemp+"</ul>"; // 显示搜索结果 document.getElementById("search_result").innerHTML = strTemp }
源程序: ajaxsearch.rar |