我遇到了分配类和隐藏并显示td
的问题。
这是我的HTML:
<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(onchange):
$('#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
)的green
不再更新(onchange),而其他类型已开启:
$(this).find('td[class=absoluteResult]').fadeOut(100).html(formatedAbsoluteResult).fadeIn(100)
我不明白这种行为。任何帮助非常感谢。
答案 0 :(得分: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”而不是“onchange”,但你可以使用你需要的任何东西。希望这会有所帮助。