8

如果用户点击div表格标题内部，是否可以停止表格排序th？

就我而言， div 具有onClick="resize(e)"我所做的功能：

function resize(e) {
        if (!e) var e = window.event;
        e.stopPropagation();
        ....

但它不起作用。

编辑：表格在e.stopPropagation()或之前排序return false

4

3 回答 3

7

我为你做了两个演示。第一个将表头的内容包裹在一个跨度中，第二个使用未记录的onRenderHeader函数添加表头span内部。无论哪种方式，只有内容span是可单击的（文本），而在内容之外单击将对列进行排序。如果您使用div仅标题填充可用于初始化列排序。

演示 1 - 包含在标记中的标题内容

$('table')
    .tablesorter()
    .find('.inner-header')
    .click(function(){
        console.log('header text clicked');
        return false;
    });

演示 2onRenderHeader - 使用选项包装的标题内容

$('table').tablesorter({

    // customize header HTML
    onRenderHeader: function(index) {
        $(this)
            .wrapInner('<span class="inner-header"/>')
            .find('.inner-header')
            .click(function(){
                console.log('header text clicked');
                return false;
            });
    }

});​

如果您需要有关使用该onRenderHeader选项的更多信息，请查看我的博客文章，了解文档中缺少的内容。

于 2012-07-01T14:21:32.667 回答
5

我刚刚遇到了这个确切的问题。我尝试了所有建议，包括直接将非委托事件处理程序分配给我想要的精确元素，然后停止所有传播 + 事件本身。仍然没有运气。

但是....事实证明，jQuery 表格排序器将事件分配给mouseup事件，而不是click事件（如您所料！）。因此，为了防止 tablesort 这样做，您只需要取消该事件即可。希望这可以帮助。

  • 本
于 2013-03-09T23:48:52.040 回答
4

停止传播防止事件冒泡，但如果你想取消默认操作，你应该使用 event.preventDefault()

于 2012-06-20T10:39:07.787 回答