2

私は少し圧倒される可能性のある情報の大きなテーブルを持っています。現在、必要なものを見つけやすくするために、特定の列を表示または非表示にするボタンがあります。このコードを使用して表示/非表示にします。

<script type="text/javascript" charset="utf-8">    
function fnShowHide( iCol )
    {
        var oTable = $('#tablename').dataTable();
        var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
        oTable.fnSetColumnVis( iCol, bVis ? false : true );
    }
</script>

後で、次のコードを使用して、テーブル内の特定の列を非表示または表示します。

<button id="button">
    <a href="javascript:void(0);" onclick="fnShowHide(0);">Column1</a>
</button>
<button id="button">
    <a href="javascript:void(0);" onclick="fnShowHide(1);">Column2</a>
</button>
<button id="button">
    <a href="javascript:void(0);" onclick="fnShowHide(2);">Column3</a>
</button>

単一の行だけでなく、複数の行を非表示または表示する単一のボタンを作成するにはどうすればよいですか？

私はDataTablesを使用してデータを表示しており、上のボタンにこの例を使用しています（違いが生じる場合）。

4

1 に答える 1

8

単一の整数を入力として受け入れるのではなく、非表示にする行の配列を受け入れてみませんか？

function fnShowHide( iCols )
{
    var i, iCol;
    var oTable = $('#tablename').dataTable();

    for (i = 0; i < iCols.length; i += 1) {
        iCol = iCols[i];
        var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
        oTable.fnSetColumnVis( iCol, bVis ? false : true );
    }
}

1つの行に対してそれを呼び出すには、を使用fnShowHide([2])し、複数の行に対しては、次のような複数の値を渡します。fnShowHide([2,3,4])

于 2013-03-18T03:00:03.683 に答える