Css 当允许水平滚动时，jquery mobile出现数据列btn定位问题

我使用列切换按钮在jquery mobile中显示一个数据表，以实现响应性设计。但是，我还添加了

，这样，如果用户选择在屏幕上查看太多的项目，他们就可以水平滚动（有些人可能会认为这不符合目的，但这是为了显示报告，因此用户可能需要此功能）

无论如何，我的问题是，当用户沿表格水平滚动时，

数据列btn

会随着表格的其余部分一起移动。有没有一种方法可以让我将按钮“粘贴”到右上角，这样即使表格的其余部分滚动，按钮仍保持在相同的位置

JS小提琴在这里：

---

谢谢大家：）

您可以使用JavaScript将按钮移动到另一个DIV中。首先在表包装器上方创建一个空占位符DIV，并将表包装器DIV的宽度设置为100%：

<div id="colTogglePlaceholder"></div>
<div style="overflow:auto; width: 100%; ">  
    <table  data-role='table' data-theme='a' id='customerListTable' data-mode='columntoggle' class="ui-body-b ui-shadow table-stripe ui-responsive" data-column-btn-mini="true" data-column-btn-text="Columns to Display" data-column-btn-corners="false" data-column-btn-theme="c" data-column-popup-theme="a" >
        <thead>
            <tr>
               etc.

这是您最新的

注：这也适用于jQM 1.4

$(document).on("pageinit", "#customerList", function () {
    $(".ui-table-columntoggle-btn").appendTo("#colTogglePlaceholder");
});