Jquery 移除 class 不适用于 table 行

Question

我发布了另一个问题并已部分解决。我有一个 table，每行有一个 link。 link 调用 AJAX 并在另一个 Bootstrap 列中输出。这很好用。当我单击 link 时，将应用 class "highlight"，这会更改行的背景颜色。当我单击另一个 link 时，我希望之前单击的 clink 删除 "highlight" class，并在新行中应用 class。

目前，添加 class 有效，但任何其他 link 单击都会添加 class，但永远不会删除 class。

<table class="table table-hover unpadded" id="mashed_tab">
                    <thead>
                        <tr>
                            <th class="artcl_hdr text-center" colspan="2">
                                <p class="big_date top_pad"><i class="fa fa-rss fa-lg concrete"></i>&nbsp; Articles/Keywords for
                                2016-07-09 - 2016-07-10</p>
                            </th>
                            <th><span class="badge bkgcol-wet-asphalt">55</span></th>
                        </tr>
                    </thead>
                    <tbody class="mashed_body">
                        <tr class="mashed_row">
                            <td class="bkgcol-sunflower wht-border">
                                <div class="date_cell">
                                    <span class="asphalt long_date">Sat</span><span class="white day">Jul&nbsp;09,&nbsp;2016</span>
                                </div>
                            </td>
                            <td class="linked-title dark unpadded">
                                <div class="cell_link">
                                    <a href="javascript:;" id="linksplode" link_id="425">link 1</a>
                                </div>
                            </td>
                            <td class="small-cell">
                                <i class="fa fa-arrow-right"></i>
                            </td></tr><tr class="mashed_row">
                            <td class="bkgcol-sunflower wht-border">
                                <div class="date_cell">
                                    <span class="asphalt long_date">Sat</span>
                                    <span class="white day">Jul&nbsp;09,&nbsp;2016</span>
                                </div>
                            </td>
                            <td class="linked-title dark unpadded">
                                <div class="cell_link">
                                    <a href="javascript:;" id="linksplode" link_id="405">Link 2</a>
                                </div>
                            </td>
                            <td class="small-cell">
                                <i class="fa fa-arrow-right"></i>
                            </td>
                        </tr>
                        <tr class="mashed_row">
                            <td class="bkgcol-sunflower wht-border">
                                <div class="date_cell">
                                    <span class="asphalt long_date">Sat</span>
                                    <span class="white day">Jul&nbsp;09,&nbsp;2016</span>
                                </div>
                            </td>
                            <td class="linked-title dark unpadded">
                                <div class="cell_link">
                                    <a href="javascript:;" id="linksplode" link_id="426">Link 3</a>
                                </div>
                            </td>
                            <td class="small-cell">
                                <i class="fa fa-arrow-right"></i>
                            </td>
                        </tr>
                    </tbody>
                </table>


        <script type="text/javascript">
        $(document).ready(function() {
            attachEvents();
         });

         function attachEvents() {
            var selClass = 'highlight';

           $('#mashed_tab tr a').click(function() {
           $(this).parent().parent().removeClass(selClass);
           $(this).parent().parent().addClass(selClass);
          }); 
         };
    </script>

Answer 1

在你的点击功能中试试这样的东西，然后告诉我。

$('tr a').click(function() { 

$("#mashed_tab tr").find("." + selClass).removeClass(selClass); 

$(this).parent().parent().addClass(selClass); });

Jquery 移除 class 不适用于 table 行

Jquery remove class not working on table rows

php

jquery

ajax

codeigniter-3