0

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

我的想法是,当用户将一个元素拖到子列表的标题上并将光标保持在那里 750 毫秒时,列表会扩展,但我遇到了一个问题,我无法获得底层 div 的 ID,因为jquery 似乎抓住了我正在拖动的项目的 ID,而不是我让它悬停的项目的 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容器的悬停,除了我拖动的元素的父级片刻。我需要找到一种方法来“窥视”它的背后。因此,如果我从#c9拖动一个项目jquery 认为我总是悬停在#c9

4

1 回答 1

1

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

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

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

于 2010-12-23T15:30:40.823 回答