jQuery 自动完成：如何显示动画 gif 加载图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4489607/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery autocomplete: How to show an animated gif loading image
提问by Daniel Pe?alba
I'm using the jQuery AutoCompleteplugin combined with ajax. Do you know how can I show a progress indicator while the ajax search is performed?
我正在使用结合 ajax的 jQuery AutoComplete插件。您知道如何在执行 ajax 搜索时显示进度指示器吗？
This is my current code.
这是我目前的代码。
<script type="text/javascript">
$("#autocomplete-textbox").autocomplete('http://www.example.com/AutoComplete/FindUsers');
</script>
<div>
<input type="text" id="autocomplete-textbox" />
<span class="autocomplete-animation"><img id="ajaxanimation" src="../img/indicator.gif")"/></span>
</div>
The FindUsers URL returns a user list in the content.
FindUsers URL 返回内容中的用户列表。
回答by Sam Wilson
autocomplete already adds the ui-autocomplete-loadingclass (for the duration of the loading) that can be used for this...
自动完成已经添加了ui-autocomplete-loading可用于此的类（在加载期间）...
.ui-autocomplete-loading { background:url('img/indicator.gif') no-repeat right center }
回答by Dalen
$("#autocomplete-textbox").autocomplete
(
search : function(){$(this).addClass('working');},
open : function(){$(this).removeClass('working');}
)
where CSS class working is defined as follow:
CSS类工作定义如下：
.working{background:url('../img/indicator.gif') no-repeat right center;}
EDIT
编辑
Sam's answeris a better approach to address the problem
Sam 的回答是解决问题的更好方法
回答by David
If no results isn't works you can do this:
如果没有结果不起作用，您可以这样做：
$("input[name='search']").autocomplete({
...,
select: function( event, ui ) {
action show image
}
}).data( "autocomplete" )._renderItem = function( ul, item ) {
action hide image
}
