实现快速Javascript搜索? [英] Implementing a Fast Javascript Search?

问题描述

基本上:

1. 我有一个带有文本框的页面，该页面下方有一个<ul>列表. <ul>由用户的朋友列表填充.

1. I have a page with a textbox, and a <ul> list below it. The <ul> is populated by a list of the user's friends.

用户开始在文本框中输入朋友的名字，例如按'r'

The user begins typing in the name of a friend in the textbox, e.g pressing 'r'

我希望每次按键时立即更新<ul>，以仅显示名称以R开头的朋友，例如'Richard，Redmond，Raheem'等.

I want to immediately update the <ul> with each keypress to show only those friends whose names begin with R, e.g 'Richard, Redmond, Raheem', etc.

随着用户键入的内容更多，我想进一步限制名称，例如，如果用户键入"Ri"，那么我只希望列表中的"Richard".

As the user types more, I want to further restrict the names, e.g if user types 'Ri' then I only want 'Richard' in the list.

我正在寻找有关如何实现搜索的想法.具体来说，如果我应该使用Array或JSON类来存储好友列表，是否应该使用正则表达式，等等?

I'm looking for ideas on how to implement the searching. Specifically, if I should use an Array or JSON class for storing the list of friends, if there's any regular expression I should use, etc?

我还应该使用哪个jQuery事件来监听按键事件?

Also which jQuery event should I use for listening to the keypress events?

推荐答案

工作示例: http://jsfiddle.净/peeter/gAAth/

这就是我要这样做的方式，我不会在数组中重复数据.

Working example: http://jsfiddle.net/peeter/gAAth/

This is how I'd do it, I wouldn't duplicate data in an array.

Raynos提供的优化版本: http://jsfiddle.net/gAAth/12/

An optimized version provide by Raynos: http://jsfiddle.net/gAAth/12/

这篇关于实现快速Javascript搜索?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！