Javascript jQueryUI自动完成结果的自定义通知
我有一个带有name属性的对象数组,我想用jQueryUI的自动完成功能来搜索它。当一个字母被键入时,自动完成会显示一个文本,其中包含返回的结果数量。但是,当菜单关闭或文本框为空时,这不会更新。我想知道以下几点: 告诉我们菜单中有多少结果的行为在哪里?我寻找通用字符串X结果,使用上下箭头键导航,但我没有看到它。 如果我只想激发一个特定的函数,比如说五个结果呢。如何重写导致此行为的任何基jQueryUI函数? 小提琴:Javascript jQueryUI自动完成结果的自定义通知,javascript,jquery,jquery-ui,autocomplete,Javascript,Jquery,Jquery Ui,Autocomplete,我有一个带有name属性的对象数组,我想用jQueryUI的自动完成功能来搜索它。当一个字母被键入时,自动完成会显示一个文本,其中包含返回的结果数量。但是,当菜单关闭或文本框为空时,这不会更新。我想知道以下几点: 告诉我们菜单中有多少结果的行为在哪里?我寻找通用字符串X结果,使用上下箭头键导航,但我没有看到它。 如果我只想激发一个特定的函数,比如说五个结果呢。如何重写导致此行为的任何基jQueryUI函数? 小提琴: $(document).ready(function () {
$(document).ready(function () {
var objArray = [{
name: 'James',
department: 'Dept.1',
experience: 1
}, {
name: 'Jessie',
department: 'Dept. 2',
experience: 2
}, {
name: 'Walt',
department: 'Dept. 3',
experience: 3
}
];
$(document.body).on('autocompletesearch', function (e, ui) {
//hides the div whenever the value in the text box no longer matches
//the name in the array
$('.hider').hide();
});
//this function will take in an array
//and a property and make a smaller array
//which can be searched using the autocomplete
function getRefArray(a, attr) {
var newArray = [];
for (var i = 0; i < a.length; i++) {
for (var prop in a[i]) {
if (prop == attr) {
newArray.push(a[i].name);
}
}
}
return newArray;
}
//when an element is selected from the autocomplete menu
//this functions returns a div to be bound to the page
function getCard(n) {
var $div = $('<div>').text(n).addClass('hider').show();
return $div;
}
$('#autocomplete').autocomplete({
source: getRefArray(objArray, 'name'),
select: function (event, ui) {
var name = ui.item.value;
getCard(name).appendTo('body');
},
search: function (event, ui) {
},
open: function (event, ui) {
},
close: function (event, ui) {
console.log('closed menu, remove results count');
}
});
});