Question

我有一个容器div内的列表项。结构如下：

<div id="container">
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
</div>

我使用jQuery sortable来交换列表项，如here所示。

我想确定列表项是否被拖到包含div之外，如果是，请将其删除。

我一直尝试做的是使用offset()来确定列表项距div的距离，但它会给我不一致的结果：

$( ".sortable" ).sortable({
    revert: true,
    update: function( event, ui ) {
        console.log("difference: " + (parseInt($(ui.item).offset().top,10) - parseInt($("#importer-container").offset().top,10)) );
    }
});

有时会说1.有时它会说26.如果重要，容器div会有一个滚动条。

如何确定孩子是否在父母之外？

Answer 1

$( ".sortable" ).sortable({
    revert: true,
    update: function( event, ui ) {
        if (ui.item.closest("#container").length) {
            // inside container
        } else {
            // outside container
        }
    }
});

http://api.jquery.com/closest/

如何确定子元素是否在包含祖先之外？

1 个答案: