Question

我使用Twitter Bootstrap collapse函数隐藏表格行。我还在跨度中的文本中有一个链接，触发崩溃/展开。不幸的是，当我点击链接时，首先展开折叠的文本，然后跟踪链接。

我希望能够在点击链接时跳过触发折叠切换。以下是一些演示此问题的代码（live jsfiddle example here）：

<table class="table">
    <tr data-toggle="collapse" data-target="#collapseRow1" style="cursor: pointer;">
        <td>Click me to show more!</td>
        <td><a href="http://getbootstrap.com/css/">but don't expand after clicking this link</a></td>
    </tr>
    <tr class="collapse" id="collapseRow1">
        <td>hidden content1</td>
        <td />
    </tr>
</table>

Answer 1

在点击事件中使用event.stopPropagation（）。

http://api.jquery.com/event.stoppropagation/

$（“table.table td a”）。on（'click'，function（e）{e.stopPropagation（）;}）

要了解为什么事件冒泡DOM树，请阅读http://api.jquery.com/category/events/event-object/

Answer 2

你可以在链接<a class="outsidelink" href="http://getbootstrap.com/css/">上添加一个类，然后在js里面做这样的事情

$(".outsidelink").on('click', function (e) { e.preventDefault(); })

@ MustDie1Bit preventDefault()所指示的

EDIT：会阻止所有。您可以使用e.stopPropagation();代替

如何在单击collapse元素中的链接时跳过触发引导崩溃？

2 个答案: