在我的网络应用程序中,我显示股票价格。我使用 jquery 自动完成功能在输入股票名称时显示选项。但我已经构建了 javascript 数组的本地副本。我想显示此本地数组中的选项,如果在本地数组中找不到搜索词,则必须进行 ajax 调用以从服务器端获取列表。
谢谢!!!
//Local array
var local_array=["option1","option2"];
//jqueryUI call of autocomplete function
$('#search_stock').autocomplete({
source:function(){
if(search term is found in local array)
{
show suggestion from local array.
}
else
{
make ajax call to show suggestions of stock names.
}
}
});
更新
这是实际的代码
$(function() {
var cache = {'option1':'option1','option2':'option2'}, lastXhr;
$( "#stock_rates" ).autocomplete({
minLength: 2,
source: function( request, response ) {
var term = request.term;
if ( term in cache ) {
response( cache[ term ] );
return;
}
lastXhr = $.getJSON( "stock_rates.php", request, function( data, status, xhr ) {
cache[ term ] = data;
if ( xhr === lastXhr ) { response( data ); }
});
}
});
});
最佳答案
jQuery UI 自动完成的示例页面有一个恰好解决此问题的示例。
http://jqueryui.com/demos/autocomplete/#remote-with-cache 。单击该页面上的“查看源代码”链接可查看示例的代码。
关键部分是“源”接受参数。
source: function(request, response){
您需要读取request
,从缓存中获取值,或者执行请求,然后调用response
函数并向其传递匹配的值。
更新
您现在的问题是您存储在缓存中的格式错误。缓存仅存储从 getJSON 调用返回的数据,并按搜索词索引。由您决定是否进行前缀检查等。
要继续您现在尝试的方式,您需要正确填充缓存。
var cache = {
"o": ['option1', 'option2'],
"op": ['option1', 'option2'],
// ....
"option1": ['option1'],
"option2": ['option2']
};
否则,您可以以不同的方式存储数据,并在“源”函数中放入更多逻辑,以对静态数组或其他内容进行前缀检查。但这实际上取决于您正在缓存的数据。
关于jquery-ui - 仅当在本地构建的数组中找不到结果时,才在 jquery 自动完成中使用 ajax 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9251355/