Jquery在切换表行时更改图标
提问于 2013-01-16 17:43:15
现在，我有以下Jquery，当单击表行时，它会关闭表行下面的行。
<script type="text/javascript">
$(function () {
$("tr.spaceUnder").hide();
$('tr:not(.spaceUnder)').click(function () {
$(this).nextUntil('tr:not(.spaceUnder)').toggle();
});
});
现在我想要的是，当我单击切换它下面的行的行时，显示一个打开/关闭图标或+/-任何东西。
这就是具有切换功能的行的外观。
<tr class="countryRow categoryHeader">
<td colspan="3" class="">
<span class="listItemHeader">
<%#((Item)Container.DataItem)["Name"]%>
</span>
</td>
<td>
<a href="#" style="float: right;"><img width="20" src="/Images/sBackTopPic.png"></a>
</td>
</tr>所以在切换时我想改变css类上的一个href在第二个td行中，这样在初始加载时显示关闭的图标，然后点击打开icon..then的时候再点击关闭的图标。所以我想知道如何用我当前的切换逻辑在我的a href上添加css类。
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-01-16 18:34:22
它会让你想要做的事情变得混乱。但在下面的click函数中，它会检查锚点，看看它是否有class-one，如果有，则删除该类并添加另一个类。如果不是，就做相反的事情。
$(function () {
$("tr.spaceUnder").hide();
$('tr:not(.spaceUnder)').click(function () {
$(this).nextUntil('tr:not(.spaceUnder)').toggle();
if($('a', this).hasClass("class-one"))
{
$('a', this).removeClass("class-one");
$('a', this).addClass("class-two");
{
else
{
$('a', this).removeClass("class-two");
$('a', this).addClass("class-one");
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14364454
复制
腾讯云开发者
