0

私はこれを機能させましたが、ソリューションはちょっと汚い感じがするので、誰かがそれを見て、素晴らしいアプローチを最適化する方法についてのヒントを与えることができれば。

背景色が設定された特定の開始テーブルがあります。その下には背景色のない同様のテーブルがありますが、実際には、これらはajaxを介して取得した配列内のレコードごとに動的に作成されます。スクリプトの目的は、結果のグリッドのすべての列の背景色をコピーすることです。

for (var i = 2; i < 34; i++) {
    var c = $('table tr td:nth('+ i + ')').css('background-color');        
    $('table tr td:nth-child('+i+')').css('background-color',c);
}

最初に最初のテーブルから背景色を見つけ、次にループコピーでこの見つけた色をコピーします。

小さな更新：少なくともIE8で動作する必要があります。

例はここにあります：http：//jsfiddle.net/KvdM/9RRfU/。

4

2 に答える 2

0

CSS3のcolとnth-childだけを使用することも検討してください。赤い列の例を参照してください。

http://jsfiddle.net/pdejuan/9RRfU/5/

Col要素に関する追加情報

于 2012-09-12T15:48:46.967 に答える
0

次のコードは、テーブルセルの最初の行を取得し、それらを繰り返し処理します。jQueryでラップされたthis暗黙のパラメーターをキャッシュし、テーブル内の列の場所との列の場所を取得しますbackground-color。次に、その場所にある残りのテーブルセルを同じで更新しますbackground-color。

$(function() {
    $( "tr:first td" ).each(function() {
        var $this = $( this ),
            index = $this.index(),
            color = $this.css( "background-color" );

        $( "td:nth-child(" + index + ")" ).css( "background-color", color )
    });
});

上記のスニペットを含むjsFiddleは次のとおりです... http：//jsfiddle.net/fpVuW/

テーブルに特別なクラスを追加し、それらのテーブルのみを操作するようにjQueryを更新することを検討してください。そうしないと、ページに他のテーブルがある場合、それらも変更されます。

別の解決策は、あるテーブルを別の特定のテーブルにコピーする関数またはプラグインを作成してから、各テーブルの関数/プラグインを呼び出すことです。そうすれば、どのテーブルを変更するかをより細かく制御できます。

于 2012-09-13T13:14:49.450 に答える