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

私はあなたのために2つのデモを作りました。1つ目は、テーブルヘッダーのコンテンツをスパンでラップし、2つ目は、ドキュメント化されていない関数を使用してヘッダーの内側onRenderHeaderに追加します。spanいずれにせよ、コンテンツのspan外側をクリックすると列がソートされ、コンテンツのみがクリック可能（テキスト）になります。divヘッダーパディングのみを使用する場合は、列の並べ替えを初期化できます。

デモ1-マークアップでラップされたヘッダーコンテンツ

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

デモ2-onRenderHeaderオプションを使用してラップされたヘッダーコンテンツ

$('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イベントにイベントを割り当てます（ご想像のとおりです！）。したがって、tablesortがそれを実行しないようにするには、代わりにそのイベントをキャンセルする必要があります。お役に立てれば。

  • ベン
于 2013-03-09T23:48:52.040 に答える
4

伝播を停止してイベントがバブルアップするのを防ぎますが、デフォルトのアクションをキャンセルしたい場合は event.preventDefault() を使用する必要があります

于 2012-06-20T10:39:07.787 に答える