介绍:类似于实现ios通讯录中右侧字母,快速导航到联系人的效果,如图:

JQuery根据字母检索元素并导航到指定位置

Html代码如下,分别是字母和港星名字的排序:

 1         <input type="text" id="searchBox" />
 2         <ul id="letter">
 3             <li>C</li>
 4             <li>L</li>
 5             <li>D</li>
 6             <li>E</li>
 7             <li>F</li>
 8             <li>G</li>
 9             <li>H</li>
10             <li>X</li>
11             <li>Z</li>
12         </ul><br />
13         <ul id="dataSet">
14             <li>刘德华</li>
15             <li>黄日华</li>
16             <li>张学友</li>
17             <li>谢霆锋</li>
18             <li>陈奕迅</li>
19             <li>陈冠希</li>
20             <li>郑伊健</li>
21             <li>郭富城</li>
22             <li>黄秋生</li>
23             <li>杜琪峰</li>
24             <li>梁朝伟</li>
25         </ul>
26 
27     </div>
View Code

相关文章: