在表格行上使用 jQuery 可选择，表格中的链接不起作用

Question

我想使用jQuery Selectable 从表中选择行。问题是 jQuery 似乎劫持了所有的点击事件，所以我不能在表格中使用任何可点击的东西（在我的例子中是链接）。

HTML：

<table class="sel-table">
<thead>
    <th>col1</th>
    <th>col2</th>
    <th>col3</th>
</thead>
<tbody>
    <tr>
        <td> 
             <a href="http://www.google.com">click me! a1</a>
        </td>
        <td>a2</td>
        <td>a3</td>
    </tr>
    <tr>
        <td>b1</td>
        <td>b2</td>
        <td>b3</td>
    </tr>
    <tr>
        <td>c1</td>
        <td>c2</td>
        <td>c3</td>
    </tr>
</tbody>
</table>

CSS：

  .ui-selectable>.ui-selected
    {
        background-color: #a6c9e2;
    }

Javascript：

$(".sel-table>tbody").selectable({filter: 'tr'});

JSFiddle：http://jsfiddle.net/qt67rf12/

当您单击该链接时，什么都不会发生，而 selectable 会处理该事件。但是，中间按钮（在新选项卡中打开）可以完美运行。是什么阻止了链接上的默认操作，我该如何解决？

Answer 1

您可以使用cancel 选项

$(".sel-table>tbody").selectable({
    filter: 'tr',
    cancel: 'a'
});

更新fiddle。

这里是documentation