Question

这是页面： http://nm-bootstrap.gydev.com/course-delivery.php

V形切换图标和标题行上的书签图标都预先添加到第一个。如果单击带有th的tr，我有一些js来切换以下行。

问题是我需要从事件中排除该书签（<a>带有“bookmark-this”类），因为有人需要能够书签和整个部分而不切换下面的行。因此除了书签之外的整行都应该触发事件。

这是jQuery使它工作

$("#table-modules tbody tr:not(.section-title)").hide();

$("#table-modules tbody tr.section-title").click(function(){
    $(this).nextUntil('tr.section-title').toggle().end()
        .find('.icon-chevron-right').toggle().end()
        .find('.icon-chevron-down').toggle();
});

$(".bookmark-this").click(function(){
    $(this).find('.icon-bookmark-empty').toggle().end()
        .find('.icon-bookmark').toggle();
});

以下是渲染html的前两行

<tr class="section-title" style="cursor: pointer; ">
<th><i class="icon-chevron-right grayLight"></i><i class="icon-chevron-down grayLight" style="display: none; "></i><a class="bookmark-this"><i class="icon-bookmark-empty grayLight"></i><i class="icon-bookmark red" style="display: none; "></i></a>1. Introduction</th>
<th>&nbsp;</th>
<th>11:53</th>
</tr>
<tr style="display: none; ">
<td style="padding-left: 45px; "><a class="bookmark-this"><i class="icon-bookmark-empty grayLight"></i><i class="icon-bookmark red" style="display: none; "></i></a><a href="#">How to take an online course</a></td>
<td><img src="/img/icons/check-sm.png" width="16" height="13" alt="yes"></td>
<td>6:32</td>
</tr>

我该怎么做？

Answer 1

尝试将stopPropagation添加到.bookmark-this

的点击处理程序中

$(".bookmark-this").click(function(e){ e.stopPropagation() });

Answer 2

你可以使用not selector

$("#table-modules tbody tr.section-title:not(.bookmark-this)").click

单击tr时排除链接

2 个答案: