您的位置:首页 > Web前端 > BootStrap

bootstrap3-typeahead使用具体的示例

2018-03-17 10:35 363 查看
$('#id').typeahead({
//query是当前输入框中所输入的内容,process是一个回调函数,它用来将我们得到的结果转换为typeahead组件可以识别的数据
source: function (query, process) { //source只能处理基本类型数组
var parameter = query;//query:输入框的数据.
$.ajax({
url : '/studio/IMVideoLiveAction/queryForLike',
type : 'get',
dataType : 'json',
data : {
parameter : parameter
},
success : function(data) {
var obj= eval(data);//解析json数据
var name = [];//定义一个基本类型数组
for(var i=0;i<obj.length;i++){
var aa=obj[i].account_id+" "+obj[i].account_name+" "+obj[i].full_name+" "+obj[i].nick_name;
name.push(aa);//把复杂类型数组的每一个元素的name保存到基本类型数组里
}
process(name);//调用处理函数,格式化.把转换生成的基本类型数组交给source处理
}
})
},

highlighter: function (item) { //显示处理(使用指定的方式,高亮(指出)匹配的部分)
var stock=item.split(" ");
var name=null;
for(i=0;i<stock.length ;i++){
name=stock[1]+" "+stock[2];
}
//数据列表中数据的显示方式
return name ;
},

updater: function(item) { //后续处理(在选中数据后的操作,这里的返回值代表了输入框的值)
var stock=item.split(" ");
var name=null;
for(i=0;i<stock.length ;i++){
//账号id
$('#account_id').val(stock[0]);

name=stock[2];
}
//选中后,最终输入框里的值
return name;
}
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: