Javascript 带鼠标盖的手风琴儿童

我一直在尝试让一个超大菜单与鼠标一起工作，而不是点击。下拉菜单和第一层的手风琴作品不错，但我有一个问题，第二层（儿童）手风琴工作的权利。我尝试过不同的java和css解决方案，它们似乎都只影响手风琴的第一层。手风琴的第二层移动到fast，以便能够打开并查看或单击任何内容。 任何想法或建议都很好

这是我代码的一个链接

---

我已对您的JSFIDLE进行了编辑。这是最新的小提琴

你的小提琴没有什么问题，特别是

$('.panel-collapse').not(target).collapse("hide")
$(target).collapse(option);

改成

$('.panel-collapse').removeClass("show").addClass("hide")
$(target).addClass(option);

试试这个

$(function() {
$(document).on('mouseenter.collapse', '[data-toggle=collapse]', function(e) {
    var $this = $(this),
        href, 
        target = $this.attr('data-target') 
                 || e.preventDefault() 
                 || (href = $this.attr('href')) 
                 && href.replace(/.*(?=#[^\s]+$)/, ''), //strip for ie7
        option = $(target).hasClass('in') ? 'hide' : "show"

        $('.panel-collapse', '.sub-panel-collapse').not(target).collapse("hide")
        $(target).collapse(option);
})

}))

还有这个

这是代码的一般问题吗？我现在明白了，如果你点击它，它会变得很奇怪，在没有打开手风琴的情况下显示手风琴中的文本，而且手风琴子在进行鼠标悬停时仍然不能正常工作。有没有办法不让“双鼠标悬停”我看到它是鼠标悬停打开，也是鼠标悬停关闭

$(function() {
$(document).on('mouseenter.collapse', '[data-toggle=collapse]', function(e) {
    var $this = $(this),
        href, 
        target = $this.attr('data-target') 
                 || e.preventDefault() 
                 || (href = $this.attr('href')) 
                 && href.replace(/.*(?=#[^\s]+$)/, ''), //strip for ie7
        option = $(target).hasClass('in') ? 'hide' : "show"

        $('.panel-collapse', '.sub-panel-collapse').not(target).collapse("hide")
        $(target).collapse(option);
})