用AJAX实现例如百度搜索的提示功能遇到的问题

问题描述

首先写了一个test.jsp代码如下:<%@pagelanguage="java"pageEncoding="GBK"%><!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html;charset=GBK"/><title>仿百度搜索的下拉框效果</title><scripttype="text/javascript">functiontextsearch(){vartextName=document.getElementById("textname");vardataNode=document.getElementById("data");while(dataNode.hasChildNodes()){dataNode.removeChild(dataNode.firstChild);}if(textName.value!=""){listName(textName.value);}}functionreadyAJAX(){try{returnnewXMLHttpRequest();}catch(e){try{returnnewActiveXObject("Msxm12.XMLHTTP");alert("1");}catch(e){try{returnnewActiveXObject("Microsoft.XMLHTTP");alert("2");}catch(e){return"Anewerbrowserisneeded.";alert(3);}}}}functionlistName(text){varnameList=AJAXresponse.split(",");varpattern="^"+text;varnameRegexp=newRegExp(pattern,"i");for(vari=0;i<nameList.length;i++){varexistDiv=document.getElementById(nameList[i]);if(!existDiv){if(nameList[i].match(nameRegexp)){vardisplayDiv=document.getElementById("data");varnewDiv=document.createElement("div");if(window.attachEvent){newDiv.attachEvent("onclick",function(e){document.forms["nameform"].textname.value=e.srcElement.firstChild.nodeValue;});newDiv.attachEvent("onmouseover",function(e){e.srcElement.style.background="#FFFFFF";});newDiv.attachEvent("onmouseout",function(e){e.srcElement.style.background="#aaabba";});}else{newDiv.addEventListener("click",function(){document.forms["nameform"].textname.value=this.firstChild.nodeValue;},false);newDiv.addEventListener("mouseover",function(){this.style.background="#FFFFFF";},false);newDiv.addEventListener("mouseout",function(){this.style.background="#aaabba";},false);}newDiv.setAttribute("id",nameList[i]);newDiv.style.background="#aaabba";newDiv.style.color="#000000";newDiv.style.border="solid1px";newDiv.style.display="block";newDiv.style.width="175px";newDiv.appendChild(document.createTextNode(nameList[i]));displayDiv.appendChild(newDiv);}}}}varrequestObj=readyAJAX();varurl="LikeFinding?name="+document.getElementById("textname");requestObj.open("GET",url,true);requestObj.send();varAJAXresponse;requestObj.onreadystatechange=function(){if(requestObj.readyState==4){if(requestObj.status==200){AJAXresponse=requestObj.responseText;alert(AJAXresponse);}else{alert(requestObj.statusText);}}}if(window.attachEvent){document.getElementById("textname").attachEvent("onkeyup",textsearch);}else{document.getElementById("textname").addEventListener("keyup",textsearch,false);}</script></head><body><formname="nameform"id="nameform"action=""method="post">输入药码:<inputid="textname"type="text"name="textname"/></form><divid="data"></div></body></html>然后写了一个服务器应用程序,是相应请求的CLASS,代码如下:packagecom.servlet;importjava.io.IOException;importjava.io.PrintWriter;importjava.util.Iterator;importjava.util.List;importjavax.servlet.ServletException;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importjavax.servlet.http.HttpServletResponse;importcom.hibernate.DAO.Yaokuxinxi.Insert;importcom.hibernate.pojo.Yaokuxinxi;publicclassLikeFindingextendsHttpServlet{publicLikeFinding(){super();}publicvoiddestroy(){super.destroy();}publicvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{System.out.println("servletworking");response.setContentType("text/html");PrintWriterout=response.getWriter();Stringyaoming=request.getParameter("name");Stringresult="";Stringno=null;if(yaoming.equals("")||yaoming.length()<1){result="请填写姓名!";}else{Insertq;q=newInsert();try{Listl=q.queryByLike(yaoming);Iteratoriter=l.iterator();while(iter.hasNext()){Yaokuxinxispider=(Yaokuxinxi)iter.next();result+=spider.getYaoming()+",";no+=spider.getYaoma();//消除id,不让输出}}catch(Exceptione){e.printStackTrace();}}out.write(result);out.flush();out.close();}publicvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{response.setContentType("text/html");response.setContentType("text/xml;charset=GBK");PrintWriterout=response.getWriter();out.flush();out.close();}publicvoidinit()throwsServletException{//Putyourcodehere}}可是打开JSP后,alert(requestObj.statusText);这句就运行了,页面提示:NOTFOUND这是什么问题?是因为没有接受到服务器应用程序返回的数据吗?请高手指教PS:web.xml的配置文件正常

解决方案

解决方案二:
初学,提示:requestObj.send();应该传递null值,避免浏览器不兼容问题例如Firefox你的提交方式为:POST而你是在doGet()中处理页面问题,没有在doPost()中调用,dopost()无任何值返回过去!试试看吧!仅此知道的提示了!
解决方案三:
LZ注意发帖给点分,要不然谁给你回答问题啊!

时间: 2024-09-30 03:45:08

用AJAX实现例如百度搜索的提示功能遇到的问题的相关文章

百度上线搜索框提示功能

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 1月20日消息,今天,不少百度粉丝都发现了在百度首页也有搜索框提示功能了,无论输入汉字还是拼音都会给予提示.在百度的高级搜索设置里,还可以对汉字与拼音的搜索框提示功能进行单独设置开启或者关闭.目前此功能在百度首页.百度MP3.百度图片.百度视频已上线,其他频道暂时没有此功能. 2008年,一直都有不同地区的百度粉丝们发现,偶尔会在某些频道遇到

利用jquery.autocomplete自动完成功能实现百度搜索下拉功能

利用jquery.autocomplete自动完成功能实现百度搜索下拉功能 --> <script language="网页特效" src="jquery.autocomplete.js"></script> <script> $().ready(function() {  $("#borough_name").autocomplete("z.php教程", {   minchars:

从百度搜索框提示 再谈用户体验

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 百度推出在搜索时显示搜索框提示已经有一段时间了,本来也没太多的注意,增加了用户体验当然是好事; 今天SEO-小林与往常一样在打开百度搜索的时候,发现旁边多了个"设置"选项, 如下图红色部分: 这些都可以由用户来选择自己喜欢的显示方式 搜索提示等,不禁在感叹百度越来越重视用户体验了,想想也的没有能够抓住用户的地方怎么能够做好

Jquery实现搜索框提示功能示例代码_jquery

博客的前某一篇文章中http://www.jb51.net/article/35175.htm写过一个用Ajax来实现一个文本框输入的提示功能.最近在一个管理项目的项目中,使用后发现,真的反应很慢,数据量很大的情况下使用Ajax去实现真的不合适,于是,我又写了一个使用Jquery来实现方法. 废话不多说,上图上代码:  引用方式: 复制代码 代码如下: <body style="background-color: White;"> <form id="for

JS仿百度搜索自动提示框匹配查询功能_javascript技巧

1. 添加动态加载css文件 不需要引入css css全部在JS动态生成.2. 不需要额外的标签 只需要一个input输入框 并且默认指定一个class类名为 "inputElem" 当然也可以自己配置参数 还需要一个当前父级容器增加一个默认类名 parentCls(也可以自己配置),因为输入框匹配值后需要一个隐藏域 所以需要隐藏域增加一个class "hiddenCls" 当然也支持自己配置参数. 如下代码: 复制代码 代码如下: <div class=&q

如何用Ajax实现类似百度搜索效果

问题描述 实现的效果是 我们可以利用 上 下 键 可以选择 从数据库当中循环出来的数据 并且 搜索栏里面的 input 当中的值会 改变成当前 选择的元素的值 只要告诉我如何 利用 上 下 键可以选择元素就可以了 谢谢^_^ 问题补充:我想问下 就非得用插件才行了?我要的是一个很简单的应用 不用考虑到性能的问题的 不用插件能不能实现 解决方案 http://jqueryui.com/demos/autocomplete/#remote-jsonp下面有VIEW SOURCE<meta chars

百度开放搜索框提示为中小网站注入动力

基于该功能,用户在搜索框中输入汉字或拼音时会动态地获得相关的搜索提示和建议,使网民能够更轻而易举地找到自己的搜索目标.根据测算,深受网民欢迎的搜索框提示功能自推出以来使用率已经接近50%,并能够帮助用户减少输入成本33%以上.凭借以上优势,在页面中嵌入该功能的中小网站不但可以有效地降低用户的使用成本,而且还会在改善用户体验的同时,令网站的用户黏性明显的提升. 据了解,此次开放的搜索框提示功能模块不仅在服务上远远比竞争对手稳定,而且为中小网站站长们提供了三种引入方式,网站可以根据自身的具体情况和需

AJax实现类似百度搜索栏的功能 (面试多见)_AJAX相关

实习过程中需要用到异步提交功能,于是试着去了解了一下ajax,瞬间感觉以前学习的真是九牛一毛啊,确实如此,做web应用开发,如果不会jquery和ajax,那真的就是白学了,了解之后我才感觉网上的那些花哨的功能已经都可以实现了. 话不多说,下面有ajax实现一个简单的百度搜索栏的功能,当用户在上面的输入框中键入字符时,会执行函数 "showHint()" .该函数由 "onkeyup" 事件触发: function showHint(str) { var xmlht

jquery 模拟类搜索框自动完成搜索提示功能(改进)_jquery

autopoint.js代码: 复制代码 代码如下: /* * @date: 2010-5-22 21:42:15 * @author: 胡灵伟 * Depends: * jquery.js * * function:类似GOOGLE搜索框提示功能 */ (function($) { $.fn.autopoint = function (options) { defaults = { url:options.url, keyLeft : 37,//向左方向键 keyUp : 38,//向上方向键