Question

我的页面构建如下：

<table>
    <thead>
        <tr>
            <th>
                  Test
                  <div class="drag"/>
            </th>
            <th>
              ......
              ......
            </th>
        </tr>
    </thead>
</table>

.drag {
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: yellow;
    width: 3px;
}

目的是在<div class="drag"/>上使用mousedown / mouseup-events拖动我的colums的宽度，并且效果很好。但是我的<th>元素上也有点击事件。问题是，当我将鼠标放在<th>上时，点击事件仍为<th>触发。

我尝试了几件事：

几乎所有
在mousedown事件中返回false
取消绑定mousedown中的click事件并在mouseup事件中再次绑定它

还有其他方法可以阻止点击事件吗？

修改我仍然希望将点击事件保留在<th>上，但我不希望它在我被拖动之后启动

Answer 1

$('th').click(function(e){
    e.preventDefault();
}

Answer 2

你试过吗

event.stopImmediatePropagation();

这将调用stopPropagation，但也会阻止同一元素中的其他处理程序接收事件。

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

Answer 3

你可以在拖动开始时设置一个标志变量（ondragstart），然后当它结束时（ondragend）你将取消设置它，onclick将被包裹在一个{ {1}}条件会检查该标志。

像这样的东西（你需要根据你的代码进行调整）：

if

Jquery mousedown / mouseup阻止点击

3 个答案: