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 );
    }
}

要为一行调用它，您只需使用fnShowHide([2])，对于多行，您将传入多个值，例如fnShowHide([2,3,4])

于 2013-03-18T03:00:03.683 回答