JQuery を使用してサイトの検索機能をセットアップしました。一致しない結果はすべて toggle() によって削除され、ページには大量のデータがあります。イメージできるように、検索の実行には数秒かかります。
検索が実行されているというユーザー フィードバックを提供するために、img ソースをスピナー gif に置き換えようとしています。
これが私がやろうとしていることです。検索ボタンの click() 時 (または検索ボックスから入力):
$('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を待機させる適切な方法は何ですか?