让输入框实现一个类似百度的搜索提示（基于jQuery事件监听）
一个令人眼花缭乱的效果，百度和谷歌似乎已经做了很多年，我觉得很容易找到代码在互联网上实现这一效果。当你真正满足这种需求，你找不到。所以我开始写这个效果，因为我已经整合到我的整个框架的影响，所以我没有单独的包。需求：
实现输入框提示，类似百度搜索，在切换时获取常用关键字，数据来自系统数据库，支持鼠标选择或键盘选择。
思想:
框架始终把类视为监控入口，并通过数据作为数据传输；
通过听的输入和propertychange事件实现实时变化的监测，输入是主流，propertychange是IE，你知道；
POST操作由Ajax实现，返回内容以框式的形式显示。
监控键盘（38），下键（40），返回键（13），通过结合keydown，判断的情况下实现；
听鼠标悬停和点击鼠标事件和键盘动作的完美结合；
如果输入内容需要与已知选项一致，则监视模糊事件以确定是否更改焦点。
实现代码：
复制代码代码如下所示：
通过冷却
用于存储/提示层的全局变量的定义
无功liketips；
监视更改或获取焦点事件
Chrome和Firefox禁用内置的自动浏览器
$（'。getsearchjson）Attr（自动完成。
$（'。getsearchjson）。Bind（ propertychange输入焦点
$ = $（this）；
如果（event.type！= 'focus'）{
如果出现更改，则状态必须再次选择，因为纯手动输入将导致无法插入值。
this.data美元（好，假）；
}
获取输入帧位置并计算顶端层的位置。
顶= 1 * $ this.offset VaR（）前25；
左= 1 * $ this.offset VaR（左）；
VaR的宽度= 1 * $ this.width（）+ 12；
重建存储提示并让其显示图层。
$（liketips）删除（）；
liketips = document.createelement（'div）；
liketips = $（美元liketips）；
这里没有提供类样式，其中大多数是位置：绝对值
liketips.addclass美元（liketips ）；
liketips.css美元（{顶：顶+ 'px，左：左+ 'px，宽度：宽度+ 'px}）；
第一个显示加载前的动态映射
liketips.append美元（' '）；
liketips.appendto美元（美元this.parent（））；
liketips.show美元（）；
ajax的定义是为了获得JSON type参数，由数据类型设置，关键字是输入值。
以表格的形式返回值显示
美元。后（ /数据/搜索。做，{类型：this.data美元（），关键词：this.val美元（）}，功能（JSON）{）
liketips.empty美元（）；
无功htmlcode = ；
对于（var i = 0；i < json.datas.length；i++）{
在这里，我需要使用值和标题2，因此使用数据值传递一个参数作为返回或鼠标单击分配给相应的位置，以便完美地替代选择。
htmlcode + =+ JSON数据{我} { 1 } +；
}
htmlcode + =请在下拉框中选择。
替换加载动态映射内容
liketips.html美元（htmlcode）；
}，JSON；
}）；
为了确保焦点的数据消失隐藏选项，提示框体
$（'。getsearchjson）。Blur（function（）{）
因为鼠标点击 / /模糊的诉讼和解前点击，将是解决这一问题
名为$（this）美元；
setTimeout（）{（）函数（
如果（$ oldthis.data（好的））
（liketips美元）。FadeOut（'fast）；
别的{
警报（为了保证数据的准确性，一定要选择一个下拉提示，谢谢合作）。
oldthis.focus美元（）；
}
}，200）；
}）；
监视键盘操作
$（'。getsearchjson）。Keydown（函数（事件）{
/ / console.log（事件。密码）；
$ = $（this）；
如果（密码= = 40事件。）{
键是向下的/
nowtr = $（美元'tr.selectedtr）；
如果选中，则向下，否则，先选择菜单。
如果（nowtr美元。长> 0）{
nexttr = $（美元nowtr.next TR'）
如果不是最后一个选项，向下移动TR，或跳转到第一个TR。
如果（nexttr美元。长> 0）{
$（'tr.selectedtr）。RemoveClass（）；
nexttr.addclass美元（'selectedtr）；
}
别的{
$（'tr.selectedtr）。RemoveClass（）；
nowtr.parent美元（），发现（TR：第一）AddClass（'selectedtr）；
}
}
别的{
$（'。liketips）。找到（TR：第一）AddClass（'selectedtr）；
}
}
如果（密码= = 38事件。）{
关键是
nowtr = $（美元'tr.selectedtr）；
如果选中，则向下，否则，先选择菜单。
如果（nowtr美元。长> 0）{
prevtr = $（美元nowtr.prev TR'）
如果不是最后一个选项，向下移动TR，或跳转到第一个TR。
如果（prevtr美元。长> 0）{
$（'tr.selectedtr）。RemoveClass（）；
prevtr.addclass美元（'selectedtr）；
}
别的{
$（'tr.selectedtr）。RemoveClass（）；
nowtr.parent美元（），发现（TR：最后的）AddClass（'selectedtr）；
}
}
别的{
$（'。liketips）。找到（TR：最后的）AddClass（'selectedtr）；
}
}
如果（密码= = 13事件。）{
关键是要确定回车和隐藏框。
nowtr = $（美元'tr.selectedtr）；
如果（nowtr美元。长度= = 1）{
/ /设定值的输入框存储项的数据值的配置参数的值一般是隐藏
美元美元（输入{ valueField =名称=+ $ this.data（'valueto '）+}）；
valuefield.val美元（美元nowtr.data（币值的））；
this.val美元（美元nowtr.text（））；
设置状态从菜单中选择，允许模糊。
this.data美元（好'，真的）；
}
（liketips美元）。FadeOut（'fast）；
返回false；
}
/ / console.log（事件。密码）；
返回true；
}）；
/ /监控鼠标移动，鼠标悬停改变选定的项目
$（document）。委托（'。liketips TD，'mouseover功能（））{
nowtr美元=美元（这）母（）；
nowtr.siblings美元（TR）RemoveClass（的）；
nowtr.addclass美元（'selectedtr）；
}）；
监视鼠标移动，选择单击
$（document）。委托（'。liketips TD '，点击'，功能（））{
nowtr美元=美元（这）母（）；
如果（nowtr美元。长度= = 1）{
相应的提示输入框
inputfield = $（美元nowtr.parent）。父（母），（），兄弟姐妹（输入。getsearchjson）；
/ /设定值的输入框存储项的数据值的配置参数的值一般是隐藏
美元美元（输入{ valueField =名称=+ $ inputfield.data（'valueto '）+}）；
valuefield.val美元（美元nowtr.data（币值的））；
inputfield.val美元（美元nowtr.text（））；
设置状态从菜单中选择，允许模糊。
inputfield.data美元（好'，真的）；
}
（liketips美元）。FadeOut（'fast）；
}）；
CSS在这里没有发布，我的实现效果如下：
复制代码代码如下所示：
Chrome和Firefox禁用内置的自动浏览器
this.attr美元（自动完成