模拟Google首页(dwr实现ajax) 弹出补全搜索结果

上周末听了在用友工作的两个学长的一个小讲座，虽然时间不长，但还是有些收获的，其中一个开发部的经理就提到了一些小的技术点，其中就包括dwr，回家后上网查了查相关资料，了解到dwr是一个java开源框架，它的诞生就是为了降低开发ajax的难度，原理类似于在javascript中调用java类，于是就使用dwr技术模拟Google首页做了个练习。由于正直全国哀悼日，页面效果与各大网站相同，采用灰色样式，在这里祝愿遭受灾难的亲人们早日重建家园。

后台数据库为Oracle：--创建查询信息表createtablesearchInfo(idnumbernotnullprimarykey,--编号contentvarchar2(100)notnull,--查询内容countnumbernotnull--查询次数)--创建序列createsequenceseq_searchInfo;--创建插入数据的存储过程createorreplaceprocedureproc_add(vContentvarchar2,vResultoutvarchar2)asvCountnumber;beginselectcount(*)intovCountfromsearchInfowherecontent=vContent;ifvCount=0theninsertintosearchInfovalues(seq_searchInfo.Nextval,vContent,1);elseupdatesearchInfosetcount=count+1wherecontent=vContent;endif;vResult:='success';exceptionwhenothersthenvResult:='fail';end;首先需要把dwr.jar导入到WEB-INF\lib目录下，然后在web.xml文件中配置DWRServlet

dwr-invokeruk.ltd.getahead.dwr.DWRServletdebugtrueThisisthedescriptionofmyJ2EEcomponentThisisthedisplaynameofmyJ2EEcomponentServletXcontrol.ServletXdwr-invoker/dwr/*ServletX/ServletX接着需要在WEB-INF\lib目录下创建dwr.xml文件，并对javascript要调用的类进行声明并公开方法，当然默认公开全部方法，需要提到的是，若类方法的参数或返回值为Bean，则还需要使用convert标签

两个xml文件配置好后，可以在地址栏中输入http://localhost:9527/工程名/dwr进行测试，若测试成功，将显示可用的类及其方法

创建控制器ServletX.java，本例中只是判断用户的搜索操作是否成功，并以控制台的形式输出

packagecontrol;importjava.io.IOException;importjavax.servlet.ServletException;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importjavax.servlet.http.HttpServletResponse;importoperation.*;publicclassServletXextendsHttpServlet{privatestaticfinallongserialVersionUID=1L;publicServletX(){super();}publicvoiddestroy(){super.destroy();//Justputs"destroy"stringinlog//Putyourcodehere}publicvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{Stringmodel=request.getParameter("model");if(model.equals("search")){Stringcontent=Translation.transCode(request.getParameter("content"));OperSearchInfoobj=newOperSearchInfo();if(obj.search(content)){System.out.println("success");}else{System.out.println("fail");}}}publicvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{this.doGet(request,response);}publicvoidinit()throwsServletException{//Putyourcodehere}}创建与数据库表对应的实体Bean，SearchInfo.java文件

packageentity;/***//***搜索信息表实体*@author非凡DZ**/publicclassSearchInfo{privateintid;//编号privateStringcontent;//查询内容privateintcount;//查询次数publicStringgetContent(){returncontent;}publicvoidsetContent(Stringcontent){this.content=content;}publicintgetCount(){returncount;}publicvoidsetCount(intcount){this.count=count;}publicintgetId(){returnid;}publicvoidsetId(intid){this.id=id;}}创建对数据库表searchInfo进行操作的类OperSearchInfo.java及方法

packageoperation;importjava.sql.*;importjava.util.*;importdb.DataBase;importentity.SearchInfo;/***//***该类包含对searchInfo表所有操作*@author非凡DZ**/publicclassOperSearchInfo{/***//***用户点击搜索按钮后执行*@paramcontent*@return*/publicbooleansearch(Stringcontent){booleanflag=false;DataBasedb=newDataBase();Connectioncon=db.getConnection();CallableStatementcs=null;try{cs=con.prepareCall("{callproc_add(?,?)}");cs.setString(1,content);cs.registerOutParameter(2,java.sql.Types.CHAR);cs.execute();if(cs.getString(2).equals("success")){flag=true;}}catch(Exceptione){System.out.println("proc异常"+e.getMessage());e.printStackTrace();}finally{try{con.close();}catch(Exceptionex){System.out.println("关闭连接异常"+ex.getMessage());ex.printStackTrace();}}returnflag;}/***//***获得与界面文本框中信息相似的前10条信息*@paramcontent界面文本框中的数据*@return相似信息*/publicArrayListgetHistory(Stringcontent){DataBasedb=newDataBase();Connectioncon=db.getConnection();ResultSetrs=null;ArrayListaryResult=newArrayList();Stringsql="selectcontent,countfromsearchInfowherecontent"+"like?andrownum模拟搜索引擎html{}{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}0){for(vari=count-1;i>=0;i--){document.getElementById('tab').deleteRow(i);}}//如果存在相关搜索记录if(data.length>0){document.getElementById('Related').style.display='';document.getElementById('x').style.display='';for(vari=0;i";varobjTd2=objTr.insertCell(1);objTd2.innerHTML="";objTd2.align='right';}}else{document.getElementById('Related').style.display='none';}}/**//*关闭历史查询记录*/functionmyClose(){document.getElementById('Related').style.display='none';}/**//*鼠标在相关搜索内容上方时执行*/functionoverChangeColor(object){varhistories=document.getElementsByName('txtHistory');for(vari=0;i0&&(nKeyCode==38||nKeyCode==40)){//如果存在相关搜索信息varhistories=document.getElementsByName('txtHistory');for(vari=0;i0){leaveChangeColor(histories[tempRowId]);overChangeColor(histories[tempRowId-1]);document.frm.content.value=(histories[tempRowId-1]).value;}else{leaveChangeColor(histories[0]);overChangeColor(histories[count-1]);document.frm.content.value=(histories[count-1]).value;}}elseif(nKeyCode==40){//向下键if(tempRowId==0&&histories[0].style.background!='#ccffcc'){overChangeColor(histories[0]);document.frm.content.value=histories[0].value;}elseif(tempRowId模拟搜索引擎

关闭