jquery - 无法找到表格在页面上的当前位置

Question

我正在使用 twitter bootstrap 尝试通过克隆表来锁定表中的第一列，如下所示:

$('#dashboardtab').load('load_table.php', function() {  

    $('#scroller #testcase').each(function(){
        var table = $(this),
        fixedCol = table.clone(true),
        fixedWidth = table.find('th').eq(0).width(),
        tablePos = table.position();

        alert("LEFT: " + tablePos.left);

        ...
    });
});

我的 HTML 看起来像这样:

<div class="row">
<div id="scroller">

    <table id="testcase" class="table table-striped table-bordered table-condensed">
    <thead>
        <tr>
           <th>TEST 1</th>
           <th>TEST 2</th>
           <th>TEST 3</th>
        </tr>
    </thead>
    <tbody>
    ...
    </tbody>
    </table>
</div>
</div>

知道为什么位置总是 0 吗？当查看页面时，它显然不在这个位置。

Answer 1

我认为问题在于 position() 返回元素相对于其父元素的位置；而在这种情况下，您似乎想要页面上的位置，即 offset() (但据我所知，否则使用相同的方法)。从 API(对于 position()):

The .position() method allows us to retrieve the current position of an element relative to the offset parent. Contrast this with .offset(), which retrieves the current position relative to the document. When positioning a new element near another one and within the same containing DOM element, .position() is the more useful.

因此，我建议:

tablePos = table.offset();

引用文献:

• offset() .
• position() .