首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Jquery在切换表行时更改图标

Jquery在切换表行时更改图标
EN

Stack Overflow用户
提问于 2013-01-17 01:43:15
回答 1查看 1.4K关注 0票数 0

现在,我有以下Jquery,当单击表行时,它会关闭表行下面的行。

代码语言:javascript
代码运行次数:0
运行
复制
<script type="text/javascript">
$(function () {
    $("tr.spaceUnder").hide();
    $('tr:not(.spaceUnder)').click(function () {
        $(this).nextUntil('tr:not(.spaceUnder)').toggle();
    });
});

现在我想要的是,当我单击切换它下面的行的行时,显示一个打开/关闭图标或+/-任何东西。

这就是具有切换功能的行的外观。

代码语言:javascript
代码运行次数:0
运行
复制
<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类。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-01-17 02:34:22

它会让你想要做的事情变得混乱。但在下面的click函数中,它会检查锚点,看看它是否有class-one,如果有,则删除该类并添加另一个类。如果不是,就做相反的事情。

代码语言:javascript
代码运行次数:0
运行
复制
$(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");
            }
        });
    });
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/14364454

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档