Question

我正在使用jquery可排序功能来对应用程序中的项列表进行排序。看到我的列表变得非常大，我决定在可以展开或折叠的子列表中重新组织它们。

我的想法是，当用户在子列表的标题上拖动一个元素并将其光标保持在750毫秒时，列表会扩展，但是我遇到了一个问题，我无法获取底层的ID div的ID，因为jquery似乎抓住了我拖动的项目的ID，而不是我将它悬停在上面。

我是否有可用于实现此目的的功能或插件（我确定我不是第一个遇到此问题但我的googlefu未能找到与我相关的任何内容）。

感谢您的帮助：）

编辑：

这是我想要做的事情的想法：

$('.categoryLi').hover(function(){expandCategory(this.id);});

function expandCategory(id)
{
    if(sectionDraggingMode)
    {   
        $(document).oneTime('750ms', 'expandCategoryTimer', function(){$('#'+id+' .category_content').show();});
    }
}

这是我的HTML的主旨：

<ul class="category">
    <li class="categoryLi" id="c8">
            <div class="sublistHeader"></div>
            <div id="cat_8_container" class="category_content" style="display: none;">
            //sortable list here
            </div>
    </li>
    <li class="categoryLi" id="c9">
            <div class="sublistHeader"></div>
            <div id="cat_9_container" class="category_content" style="display: none;">
            //other sortable list here
            </div>
    </li>
</ul>

现在当我将鼠标悬停在 .categoryLi 上时，我调用expandCategory发送我正在悬停的元素的id，但它永远不会触发任何 .categoryLi <的悬停/ em>容器除了我正在拖动的元素的父元素。我需要找到一种方法来“窥视”它。所以，如果我从＃c9 拖动一个项目，jquery认为我总是在＃c9

上空盘旋

Answer 1

事实证明，jquery的droppable可以用于此。我将我想要用作扩展区域的区域定义为可放置区域，并在触发过度事件时执行此操作。

$('.categoryLi > .toolbar').droppable({
    accept: ".sectionLi",
    over: function(event, ui){
        $(this).siblings('.category_content').show();
        $('.section').sortable('refreshPositions');
    }
});

此修复程序存在一些问题，但至少它解决了悬停的问题。希望这可以在将来帮助某人。

Jquery Sortable获取底层div的ID

1 个答案: