表列切换UI未刷新

Posted 2021-05-06

在jquery mobile v 1.4.5中，使用列toogle选项动态添加表行。最初将列添加到列，然后添加动态行，这会在UI中隐藏选定的行，但会检查切换弹出元素。

<table id="tab" data-role="table" data-mode="columntoggle" class="ui-responsive">
    <thead id="th">
        <tr id="tr1">
            <th>First</th>
            <th data-priority="1">Second</th>
            <th data-priority="2">third</th>
            <th data-priority="3">Fourth</th>
        </tr>
    </thead>

看到这个FIDDLE首先单击列按钮启用第四列和第五列，现在单击添加行按钮第四行和第五行从UI隐藏但是再次单击列弹出第四列和第五列被选中。

（由于表刷新，第四和第五列被隐藏，但如果删除刷新，则toogle不适用于动态行）

答案

尝试使用rebuild而不是refresh：

$('#tab').table( "rebuild" );

API Doc：http://api.jquerymobile.com/table/#method-rebuild

更新了FIDDLE