建发实习面试时有提到这个问题,回来就考虑去实践一下,结果花了不少时间.主要是javascript在前台的表现问题,数据库结构设计等.网上有少数的几个dom教程,没有值得借鉴的地方,而>中第16章 搜索提示(suggest)中那个例子实在是简陋(当然是说javascript表现部分),而且数据库用mssql,后台语言用jsp,和自己熟悉的格格不入(虽然都是以后要接触的),所以自己动手了.模仿效果:google suggest
*开发平台:windows2003 iis6.0 access数据库
*工具:dreamweaver(写asp),aptana(写javascript,html和css),emeditor(写这篇文章),access2003(数据库)
*测试平台:firefox2.0,ie6.0,ie7.0
*演示地址:http://finish.3322.org/suggest/index.htm(短期有效,在本机上,可能访问不顺畅)
*:文件结构:
index.htm:首页,展现效果
ajax_result.asp:ajax调用后台返回结果文件
result.asp:搜索结果文件,这个我并没有做,具体功能根据需求来写
数据库(suggest.mdb):
id:自动编号
keyword:关键字
seachtimes:被搜索次数
matchnum:匹配的文章数目(关于这个方面想了蛮久,如何取得文章数呢,不能是搜索时动态产生,不然在偌大数据库中查询费时费力.那么必然是在后台某个时候去其他的数据库表中添加的,原来想把这方面也做了,但限于算法的不成熟和时间的限制.所以就用了随机数来替换.)
*开发过程遇到问题:
1.css方面:遇到了ie双倍浮动边界bug(float:left下的margin-left是设置的两倍,用display:inline消除)
2.javascript方面:
一个是那个全局变量j的上下界问题着实让我乱了一会,还好理清了思路
按键事件的兼容性问题:ie的keycode,其他浏览器的which事件
onkeypress和onkeyup,onkeydown事件的区别:onkeypress只接受数字和字母,不接受系统按键(如上下
方向键)
使用submit()方法时不能定义某个标签的id或name为submit,不然将提示缺少对象
还有一些细节判断问题,也让我费了不少神
3.html方面:
如何让表单不记忆(在firefox下自动记忆会挡主ajax部分,而google中就没有这样的提示功能,所以去掉了表单记忆功能),只要在form中加一个autocomplete="off"
*补充:
和google suggest还有一些差距,比如一直按着方向键问题和其他细节问题,这些都有待改进.
*效果图:
限于文章长度,只帖首页和js,其他的去附件下载:
草履虫--仿googlesuggest.rar
首页:index.htm
