select2中文选项通过拼音或者首字母快速定位选项

使用SELECT2的时候，想通过拼音或者首字母检索下拉的选项，但是又没有通过AJAX技术等去实现
这时候可以试试用这种伪方法〜

这种方法的好处就是快，方便使用

默认选择2如图：

代码：<option>中的值是由后台拼接生成

[html]   查看纯 文本  

1. < div >  
2. < select name = “test” id = “test” >    
3.     < option value = “1” > 王者荣耀| wangzherongyao | wzry </ option >   
4.     < option value = “2” > 部落冲突| buluochongtu | blct </ option >   
5.     < option value = “3” > 枪战王者| qiangzhanwangzhe | qzwz </ option >   
6.     < option value = “4” > 永恒纪元| yonghengjiyuan | yhjy </ option >   
7.     < option value = “5” > 英魂之刃| yinghunzhiren | yhzr </ option >   
8.     < option value = “6” > 皇室战争| huangshizhanzheng | hszz </ option >   
9.     < option value = “7” > 一起来飞车| yiqilaifeiche | yqlfc </ option >   
10.     < option value = “8” > 海岛奇兵| haidaoqibing | hdqb </ option >   
11.     < option value = “9” > 阴阳师| yinyangshi | yys </ option >   
12.     < option value = “10” > 热血江湖| rexuejianghu | rxjh </ option >   
13. </ select >  
14. </ div >  
15. < script >  
16.     $（ '＃测试'）。选择2（{  
17.         宽度：150，  
18.         allowClear：true，  
19.         formatResult：function（item）{  
20.             var  str  =  item .text;  
21.             var  idx  =  str .indexOf（'|'）;  
22.             return str.substring（0，idx）;  
23.         }，  
24.         formatSelection：function（item）{  
25.             var  str  =  item .text;  
26.             var  idx  =  str .indexOf（'|'）;  
27.             return str.substring（0，idx）;  
28.         }，  
29.         占位符：' - 请选择 - '  
30.     }）;  
31. </ script >  

效果图：

转自：https ：//blog.csdn.net/u012906135/article/details/70568932

补充：后台拼接name+拼音

前台接收：提交时采用赋值另一个属性来提交值

提交值：