2011-11-17 76 views
0

我遇到了分配類和隱藏和顯示td的問題。 這裏是我的HTML:JQuery - 隱藏()和addClass衝突

<table id="fundTable"> 
    <tr> 
     <td class="rentability"> <span class="someClass"> 0.12 </span> </td> 
     <td class="absoluteResult">0.66</td> 
    </tr> 
    <tr> 
     <td class="rentability"> <span class="someClass"> -0.24 </span> </td> 
     <td class="absoluteResult">-.45</td> 
    </tr> 
</table> 

這裏是我的Javascript(平變化):

$('#fundTable tr').each(function() { 
    formatedAbsoluteResult = 'SOME NUMBER' 
    $(this).find('td[class=absoluteResult]').fadeOut(100).html(formatedAbsoluteResult).fadeIn(100) 
    if (formatedAbsoluteResult < 0) 
     $(this).find('td[class=absoluteResult]').removeClass('green').addClass('red') 
    else 
     $(this).find('td[class=absoluteResult]').removeClass('red').addClass('green') 
} 

的想法是顯示綠色的數量,如果它是積極的,通過分配適當的類。否則紅色。當我在頁面加載時運行它時,此代碼完美工作。然後,不更新td的是有一個指定的類(red或​​)了(平變化),而其餘的都在:

$(this).find('td[class=absoluteResult]').fadeOut(100).html(formatedAbsoluteResult).fadeIn(100) 

我不理解這種行爲。任何幫助不勝感激。

+0

「onchange」是什麼意思? onchange事件僅適用於字段元素,即:input,select,textarea – Sinetheta

回答

1

我覺得這個區塊的整體設計略有調整會有幫助。

這似乎是做你正在嘗試完成(live demo at jsFiddle)。不要忘記更改部分,我即興:

$("#testing").keyup(function() { 
    $("#fundTable tr").each(function() { 
     formattedAbsoluteResult = 
     $(this).find("td.absoluteResult").fadeOut(100, function() { 
      if (formattedAbsoluteResult < 0) 
      { 
       $("#fundTable tr").find("td.absoluteResult").removeClass("green").addClass("red"); 
      } 
      else 
      { 
       $("#fundTable tr").find("td.absoluteResult").removeClass("red").addClass("green"); 
      } 
     }).html(formattedAbsoluteResult).fadeIn(100); 
    }); 
}); 

通知使用的回調函數,也是「KEYUP」而不是「平變化」,但你可以使用任何你所需要的。希望這可以幫助。

+0

非常感謝。 我一步一步地應用了你的修改,實際上最終只通過** td.someClass **代替所有的** td [class = someClass] **來解決問題,現在它工作得很好。 你知道我爲什麼得到這種行爲嗎? 無論如何,感謝很多,因爲它看起來很愚蠢,我沒有想到嘗試這樣的變化:) –

+1

我不完全確定,但類的點符號只是更短,所以我用它。我唯一的猜測是瀏覽器兼容性或jQuery版本的差異?好吧,無論如何,很高興你的工作! – Matt