0

必要なニーズに合った他の人に使用することが以前に提案された例を見つけました(提案された修正へのデモリンク) col タグを使用して各列を非表示にすることで、プロセスを簡素化しようとしました。クラスを col タグに追加すると、機能が壊れてしまい、修正方法がわかりません。

私のデモ：ここ

4

3 に答える 3

0

私が正しく理解していれば、th以下のようにそれらにクラスを追加する必要があります、

<tr>
 <th class="first_name">First Name</th>
 <th class="last_name">Last Name</th>
 <th class="email">Email</th>
</tr>

そして、スクリプトを以下のように少し変更します。

$("input:checkbox:not(:checked)").each(function() {
    var column = $("." + $(this).attr("name"));
    $(column).hide();
});

$("input:checkbox").click(function(){
    var column = $("." + $(this).attr("name"));
    $(column).toggle();
});

デモ：http： //jsfiddle.net/8BahZ/400/

于 2012-08-28T20:45:18.227 に答える
0

col列自体ではなく、タグを切り替えているように見えます。

于 2012-08-28T20:45:33.210 に答える
0

私の場合、Chromeでは、colタグは他のタグ（thead、th）に展開されるため、選択しcolても何も得られません。それらを取得したとしても、単に列ヘッダーを切り替えるだけです。

とにかく、コンソールが指示するように構文エラーがあります-;ステートメントを終了するため、式に含めることはできません。

よりクリーンなソリューションは、 http :nth-child：//jsfiddle.net/8BahZ/402/を使用している可能性があります。

var f = function() {
    var index = $(":checkbox").index(this) + 1;
    $("table > * > * > :nth-child(" + index + ")").toggle(this.checked);
};

$(":checkbox").click(f).each(f);  // bind handler and run it once
于 2012-08-28T20:45:35.637 に答える