大佬教程收集整理的这篇文章主要介绍了使用Dojo的FilteringSelect打造具有拼音检索功能的下拉菜单(上)，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
感谢王牌海盗的投稿！本文首发于：http://cosbor.web-144.com/?p=38
===============
在我们国内开发应用系统的过程中往往会遇到这样的需求：下拉菜单中的条目过多时，用户在筛选时往往非常费劲，希望能提供条目拼音简码的方式进行筛选，加快选择速度。而Dojo的FilteringSELEct是个非常优秀的具有动态筛选及autoComplete的下拉菜单组件，我们尝试用它来实现一个具有拼音检索功能的下拉菜单。我们以一个三国人物选择的下拉菜单为例看看FilteringSELEct的使用，注意demo使用的是dojo的1.8版本。
|
@H_607_21@
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<
html
>
head
>
"static/js/dojo/dijit/themes/claro/claro.css"
/>
script
type
"text/javascript"
src
"static/js/dojo/dojo/dojo.js"
data-dojo-config
"async: true,parSEOnLoad: true"
></
script
>
"text/javascript"
>
require([
'dijit/form/FilteringSELEct',
'dojo/store/Memory',
'dojo/domReady!'
//下拉菜单的store，"py"字段存放每个条目的拼音简码
data:[
{name:'赵云',id:'1',py:'zy'},
{name:'张飞',id:'2',py:'zf'},
{name:'刘备',id:'3',py:'lb'},
{name:'关羽',id:'4',py:'gy'},
{name:'黄忠',id:'5',py:'hz'},
{name:'魏延',id:'6',py:'wy'},
{name:'周瑜',id:'7',
{name:'孙坚',id:'8',py:'sj'},
{name:'曹操',id:'9',py:'cc'},
{name:'夏侯敦',id:'10',py:'xhd'},
]
});
id: "testSELEct",
name: "test",
value: "",
store: SELEctStore,
searchAttr: 'py',//指定输入文本框进行用来进行检索的字段
autoComplete:false
});
</
>
>
body
class
"claro"
>
div
>
body
>
>
|
以上是大佬教程为你收集整理的使用Dojo的FilteringSelect打造具有拼音检索功能的下拉菜单(上)全部内容，希望文章能够帮你解决使用Dojo的FilteringSelect打造具有拼音检索功能的下拉菜单(上)所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。