javascript - jQuery 等待 Attr 更改

Question

我使用 JQuery 为我的网站设置了搜索功能。所有不匹配的结果都通过toggle()删除，并且页面上有大量数据。正如您可以想象的那样，搜索需要几秒钟的时间才能运行。

为了提供搜索正在运行的一些用户反馈，我尝试用旋转 gif 替换 img 源。

这就是我正在尝试做的事情。单击搜索按钮(或从搜索框中输入):

$('div#search img').attr('src', '/static/img/spinner.gif');
search_contacts(s);
$('div#search img').attr('src', '/static/img/search.gif');

我打开了 Chrome 开发者工具并显示网络选项卡。当我尝试搜索时，我会看到已注册 spinner.gif 的 GET 请求。问题是该请求被设置为“待处理”，并且在 search_contacts() 运行时永远不会进行。搜索完成后，Gif 就会加载(好吧，304 在 5 毫秒内未修改)。

让 jquery/javascript 在运行函数之前等待属性更改完成的正确方法是什么？

Answer 1

我想你会用 jquery when() 找到答案。

文档:http://api.jquery.com/jQuery.when/

$.when( search_contacts(s) ).done(function() {

      $('div#search img').attr('src', '/static/img/search.gif');
});