javascript - Bootstrap-table showAllColumns 方法

Question

我有一个按钮可以显示 Bootstrap 表的所有列。当我点击时它不起作用。

代码:

    <table data-toggle="table">
        <thead>
        <tr>
            <th data-field="state" data-checkbox="true"></th>
            <th data-field="id" >ID</th>
            <th data-field="name">Name</th>
        </tr>
        </thead>
    </table>
    <button id="show_all">Show All columns</button>
    <button id="hide_all">Hide All columns</button>

<script>    

    $('#show_all').on('click', function(){
        $('table').bootstrapTable('showAllColumns');
    })

    $('#hide_all').on('click', function(){
        $('table').bootstrapTable('hideAllColumn');
    })

</script>

参见示例:

https://jsfiddle.net/ruzD/5b2vsdgy/

Answer 1

这是一个可行的解决方案。

$('#show_all').on('click', function(){
    $('table th').show();
})

$('#hide_all').on('click', function(){
    $('table th').hide();
})