使用 jquery 模拟 facebook 搜索
我是 Swadesh,一位年轻的软件工程师,总是对 Facebook 应用程序着迷。
有一次我遇到了 Facebook 搜索栏,它可以搜索朋友、社区、应用程序等。
我非常喜欢它,因为它速度非常快,并且可以为您提供智能且即时的结果。
我尝试使用 JQuery 进行类似的操作。可以在此处找到带有演示的项目
现在我面临的问题是:我将重复的记录插入到 DOM 中(从我搜索字符串的位置)。
javascript 搜索思路如下
- 在页面加载时,“将好友的所有数据从数据库加载到 DOM 中”
- 声明一个保存 DOM 数据的数组 将 DOM
- 数据推送到 javascript 数组
- 处理随后将搜索 javascipt 的 keyup 事件数组对象。如果没有找到,它将调用 ajax 函数,该函数将从数据库收集数据。
- 将检索到的数据再次推送到 DOM 中并从那里搜索
I'm Swadesh, a young software engineer who is always fascinated about facebook applications.
Once I came across facebook search bar which searches for friends, communities, applications, etc.
I just love it, because its so fast and gives you intelligent and instant result.
I tried a similar one using JQuery. The project with a demo can be found here
Now the issue I’m facing is: I get duplicate records inserted into DOM(from where I search for the string).
The javascript search idea is as follows
- On page load, “Load all data of friends from database into DOM”
- Declare an array which will hold the DOM data
- Push the DOM data into the javascript array
- Handle the keyup event which will subsequently search for the javascipt array object. If not found it will call the ajax function which will collect data from database.
- Push the retrieved data again into the DOM and search from there
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
为了处理大量数据,您不应在加载页面时将所有可能的数据加载到 dom。
使用 ajax 加载所需的结果并将其缓存在代码中,以防止多次调用同一短语。
(这也是 facebook 在他们的搜索中所做的)
有很多 jquery 插件可以非常容易地集成到您的网站中,
例如,这个:
http://docs.jquery.com/Plugins/Autocomplete
in order to handle a lot of data you should not load all the possible data to the dom while loading the page.
use ajax to load the desired results and cache them in your code in order to prevent multiple calls for the same phrase.
(this is also what facebook does on their search)
there are many jquery plugins out there that will make it extremely easy to integrate in your site
for example, this one:
http://docs.jquery.com/Plugins/Autocomplete
解决了。在过去的六个月里,我尝试了不同的解决方案,最终找到了结果。我在此处发布了带有演示和下载链接的精确搜索功能。
http://itswadesh. wordpress.com/2011/12/23/lets-see-how-facebook-search-is-so-fast/
Solved. During this last 6 months duration i went through different kind of solutions and finally found out the result. An exact search feature with demo and download link i posted here.
http://itswadesh.wordpress.com/2011/12/23/lets-see-how-facebook-search-is-so-fast/