jquery 自动完成无法正确加载结果,除非我按下按键,否则菜单不会显示
jquery Autocomplete is not loading the results correctly and menu doesn't show unless I press down key
这是我的:
searchTimeoutID;
InitQuickSearch = function() {
$( 'input#quick-search' ).autocomplete({
source: []
});
$('input#quick-search', document).on('keyup', function(e) {
switch(e.which) {
default: // live search
window.clearTimeout(searchTimeoutID); // remove timer
var str = $(this).val(); // search string
if (str !== '') { // do the search
searchTimeoutID = window.setTimeout(LiveSearch, 100);
}
break;
}
});
};
LiveSearch = function() {
var str = $('input#quick-search').val();
if(str !== '') {
$.ajax({
type: 'POST',
url: '/livesearch',
data: { query: str },
cache: false,
success: function(data){
var results = data.split(',');
alert(results); // displays correct results here
$( 'input#quick-search' ).autocomplete( 'option', { source: results });
},
error: function(response) {
printError(response);
}
});
}
return false;
};
当我使用 alert(results) 输出结果变量时,值看起来是正确的。
但是,当我尝试更新自动完成中的值时,它没有显示正确的值。另外,我必须按向下键才能显示菜单。
$( 'input#quick-search' ).autocomplete( 'option', { source: results });
我做错了什么?
我只需要更改:
searchTimeoutID = window.setTimeout(LiveSearch, 100);
至:
LiveSearch();
这是我的:
searchTimeoutID;
InitQuickSearch = function() {
$( 'input#quick-search' ).autocomplete({
source: []
});
$('input#quick-search', document).on('keyup', function(e) {
switch(e.which) {
default: // live search
window.clearTimeout(searchTimeoutID); // remove timer
var str = $(this).val(); // search string
if (str !== '') { // do the search
searchTimeoutID = window.setTimeout(LiveSearch, 100);
}
break;
}
});
};
LiveSearch = function() {
var str = $('input#quick-search').val();
if(str !== '') {
$.ajax({
type: 'POST',
url: '/livesearch',
data: { query: str },
cache: false,
success: function(data){
var results = data.split(',');
alert(results); // displays correct results here
$( 'input#quick-search' ).autocomplete( 'option', { source: results });
},
error: function(response) {
printError(response);
}
});
}
return false;
};
当我使用 alert(results) 输出结果变量时,值看起来是正确的。
但是,当我尝试更新自动完成中的值时,它没有显示正确的值。另外,我必须按向下键才能显示菜单。
$( 'input#quick-search' ).autocomplete( 'option', { source: results });
我做错了什么?
我只需要更改:
searchTimeoutID = window.setTimeout(LiveSearch, 100);
至:
LiveSearch();