Javascript 选择2按选项值自动完成
我已尝试为我的站点集成标记/自动完成。它通过选项文本工作。我几乎接近结果,但仍然悬而未决 现在,当您尝试选择选项文本时,将出现相关文本。但现在我想通过选项值搜索加德满都或相关选项文本 例: 当我们搜索时,将出现a001加德满都,并选择与a002相同的值,它将出现博卡拉Javascript 选择2按选项值自动完成,javascript,jquery,css,jquery-select2,select2,Javascript,Jquery,Css,Jquery Select2,Select2,我已尝试为我的站点集成标记/自动完成。它通过选项文本工作。我几乎接近结果,但仍然悬而未决 现在,当您尝试选择选项文本时,将出现相关文本。但现在我想通过选项值搜索加德满都或相关选项文本 例: 当我们搜索时,将出现a001加德满都,并选择与a002相同的值,它将出现博卡拉 $(“选择”)。选择2({ 标签:“真”, 占位符:“选择一个选项”, allowClear:是的, 宽度:“100%”, createTag:函数(参数){ 变量项=$.trim(参数项); 如果(术语==''){ 返回nul
$(“选择”)。选择2({
标签:“真”,
占位符:“选择一个选项”,
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});代码>
。选择2容器{
最大宽度:400px;
}
加德满都
博卡拉
拉利特普尔
如果搜索a001
,则输出为输出中的显示id和文本。学习
如果该值是一个对象,则该对象应与
选择2的内部对象。id应该是要在何时查找的id
确定是否应显示占位符。案文应为:
选择该选项时要显示的占位符
示例:在输入displaykatmandu和a001后在文本框中搜索a001
在select2中使用占位符
placeholder: {
id: "-1",
text: "Select an option",
}
$(“选择”)。选择2({
标签:“真”,
占位符:{
id:“-1”,
文本:“选择一个选项”,
},
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});代码>
。选择2容器{
最大宽度:400px;
}
加德满都
博卡拉
拉利特普尔
要删除仅输入Id
时显示的Id
和文本的双重重叠,请检查输入的术语是否与现有Id
匹配,如果它只返回匹配选项的文本
:
options=[];
//为查找创建一个选择选项数组
$('.custom select option')。每个(函数(idx){
options.push({id:$(this.val(),text:$(this.text()});
});
$(“选择”)。选择2({
标签:“真”,
占位符:“选择一个选项”,
allowClear:是的,
宽度:“100%”,
createTag:函数(参数){
变量项=$.trim(参数项);
如果(术语==''){
返回null;
}
//检查术语是否与id匹配
var search=$.grep(选项,函数(n,i){
return(n.id==term | | n.text==term);//检查id和文本
});
//如果找到匹配项,请将术语替换为选项文本
if(search.length)
术语=搜索[0]。文本;
其他的
return null;//与id或文本值不匹配,因此不要将其添加到选择中
返回{
id:术语,
案文:任期,
值:true//添加其他参数
}
}
});
$('select')。打开('select2:select',函数(evt){
//控制台日志(evt);
//返回false;
});代码>
。选择2容器{
最大宽度:400px;
}
加德满都
博卡拉
拉利特普尔
是的,但我不需要在现场使用a001。只需展示加德满都或拉利特普尔。现在显示的价值和文本感谢很多朋友。我感谢如果禁用选择除列表外的选项。现在它是通过ID工作的。现在我们可以避免选择这个标签了吗?好的,这应该很容易,只要在不匹配时返回null
。我会更新代码。。。