Question

我试图在Bootstrap中悬停下拉菜单，但不知怎的，它不起作用。我怀疑我的jQuery代码是错误的，但我无法弄清楚是什么？

这是我的HTML：

<a href="#" id="dropdown-filter" data-target="#"  data-toggle="dropdown">
    <button type="button" class="btn btn-primary">Filters</button>
</a>
<ul class="dropdown-menu pull-right" role="menu">
    <li>
        <div class="results-filter">
            Content goes here
        </div>
    </li>
</ul>

和我的jQuery：

jQuery('#dropdown-filter').hover(function() {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(100).fadeIn();
 }, function() {
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(100).fadeOut();
});

当我点击顶部时它起作用，但是当我悬停时它不起作用。

Answer 1

由于jQuery(this).find('.dropdown-menu')不是.dropdown-menu的孩子，因此

<a>-#dropdown-filter无效。

.find()搜索儿童。

使用jQuery(this).next('.dropdown-menu')...

悬停时Bootstrap下拉不起作用，我做错了什么？

1 个答案: