フィルタリングする前にイメージを表示/非表示にする

Question

私が書いたjqueryルーチンを使用してフィルタリングしている実際に大きなテーブルがあるWebページがあります。とにかく、これらのテーブルが実際に大きくなり、フィルタリング機能が完了するまでに時間がかかることがあります。だから、私はアニメーションgifを再現して、ユーザーにいくつかのフィードバックがあったと思った。しかし、私が電話すると、GIFは表示されません。

$('#loadingimg').show(); 

アラート文を前に置いていない限り、表示されません。私は醜いコードをお詫びします、私は経験豊富なjquery/javascriptプログラマーではありません。

function filter() 
{ 
    var eles = ["mtmprogram","rate","stage"]; 
    var tag; 
    var classes=''; 

    $('#loadingimg').show(); 
//alert('hi'); 
    $('.report').hide(); 

    for (var i in eles) 
    { 
     tag = '#' + eles[i] + ' option:selected'; 
     if ($(tag).val()) 
     { 
      //$('.'+ $(tag).val()).show(); 
      classes = classes + '.' + $(tag).val(); 
     } 
    } 
    if (classes == '') 
     $('tr.report').show(); 
    else 
     $(classes).show(); 

    filterSubtables('Loan Number'); 
    $('#loadingimg').hide(); 

} 

多くの感謝！

Answer 1

#loadingimg要素に十分な時間を表示していない可能性があります。あなたはタイムアウトであなたのコードの残りの部分を実行することによってこれをテストすることができます：私はtag変数が使用されている方法を変更

function filter() 
{ 
    var eles = ["mtmprogram","rate","stage"], 
     classes = ''; 

    $('#loadingimg').show(); 
//alert('hi'); 
    setTimeout(function() { 
     $('.report').hide(); 

     for (var i = 0, len = eles.length; i < len; i++) 
     { 
      var $tag = $('#' + eles[i] + ' option:selected'); 
      if ($tag.val()) 
      { 
       //$('.'+ $tag.val()).show(); 
       classes = classes + '.' + $tag.val(); 
      } 
     } 
     if (classes == '') 
      $('.report').show(); 
     else 
      $(classes).show(); 

     filterSubtables('Loan Number'); 
     $('#loadingimg').hide(); 
    }, 500); 

} 

お知らせ（これはあまりjQueryの選択をすると、ローカル変数として使用するために少ないCPUのオーバーヘッドを作成しますできるだけ）。私はあなたのループをfor (a in b)より驚くほど速く実行するより良いフォーマットに変更しました：http://jsperf.com/jquery-each-vs-for-loops/2