1、文章目的：学习动态提示搜索
2、实现工具：eclipse、Dreamweaver
3、实现思路：
（1）、输入一定的字符串让系统自动提醒相关类似的信息。
（2）、事件绑定，在什么条件下发生。
（3）、即时查询数据库，动态返回信息到页面。
4、具体实现：
(1)html:
<body onload="load()"> < input id="input" onkeyup="keyup()"/>//输入内容 <div id="result" ></div>//提示层 <div id="display" ></div>//展示层 </body>
（2）js代码：
function load(){ $('#result').hide();//默认不显示 } function keyup(){ if($('#input').val().length>2){//输入length 大于2 的字符串开始触发提示 execute($('#input').val(),'like'); }else{ $('#result').hide();//不提示不显示 } } function execute(content,type){ $.ajax({ url:'path/...', //访问后台数据库，并封装有效信息 type:'post', data:'content='+ $('#input').val(), dataType:'html',//json,test,html,xml均可 success:function(returnData){//returnData数据库返回信息 if(type=='like'){ $('#result').show();//显示提示 $('#result').innerHTML=returnData.ResponseText;//包含有超链接及方法的html，包含多条相似信息 }else{ $('#result').hide(); $('#display').innerHTML=returnData.ResponseText;//页面展示结果 } } }); } //返回的html中onclick="search(returnOkStr)" //点击查询结果 function search(returnOkStr){ $('#input').val(returnOkStr);//输入框内显示完整信息 execute(returnOkStr,'');//返回真实有效的信息，输出到页面展示 }
（3）java、css代码略：
只需要controller做好返回即可。
(4)效果展示：
输入:so
出现:soso
sodu
................
(注：最好限制一下提示的条数，否则在数据量庞大的时候很不好控制，div提示应该是浮动层！)