0

アプリケーションにデータテーブルを使用しています。複数選択は最初のページで機能していますが、ページネーションのあるページ 2 と 3 では機能していないようです。

コードは、

    $(document).ready(function() {   
        $('#example tr').click( function() {
            $(this).toggleClass('row_selected');
        } );    
    } );

そしてcssは

table.display tr.even.row_selected td {
background-color: #efefef;
}

table.display tr.odd.row_selected td {
background-color: #efefef;
}

他のページで複数選択を機能させるには、他に何を含める必要がありますか? それともコードに何か問題がありますか？

助けてください

ありがとう、

4

2 に答える 2

1

2つのこと..

1.ページ2とページ3にjsコードを必ず含めてください

2.tr動的に生成される可能性があります。delegate

 $(document).ready(function() {   
        $('#example').delegate('tr','click', function() { //example -> tableid
            $(this).toggleClass('row_selected');
        } );    
    } );
于 2012-09-14T04:20:26.583 に答える
1

DOM を動的に変更しているため、jQuery 1.7 以降を使用している場合は .delegate または .on で委任する必要があります

$(document).ready(function() {   
    $('#example').on('click','tr', function() { 
        $(this).toggleClass('row_selected');
    } );    
});

またはjQuery 1.6以下を使用している場合

$(document).ready(function() {   
    $('#example').delegate('tr', 'click', function() { 
        $(this).toggleClass('row_selected');
    } );    
});

委譲することで、イベント ハンドラーを親要素にバインドします。次に、イベントがバブルアップするタイミングをリッスンします。たとえば、tr をクリックするとdocument、この例ではバブルアップし、ドキュメントがイベントを処理します。 .

通常の方法でバインドしようとすると

元

$('tr').click()function(){});

また

$('tr').bind('click',function(){});

また 

$('tr').on('click',function(){});

彼らは、dom の準備ができた時点で tr 要素が利用可能であることを期待しています - (あなたのコードを document.ready 関数の中に入れた場合) - そうでなければ、イベントは要素にバインドされません

于 2012-09-14T04:25:00.663 に答える