Question

我正在使用内置下拉菜单的Twitter Bootstrap，它们会在悬停时显示。当箭头/弹出图标出现时，用户应该知道它们可用。我希望这些下拉列表仅在用户单击/从表中选择一行后才能使用并且能够悬停。我在下面的小提琴永久地展示了它们，这不是我在这里所需要的。箭头显示应该，但我无法弄清楚如何禁用/启用下拉盘旋。有任何想法吗？提前谢谢。

的jQuery

$('table tr').click(function(){
    //enable dropdowns after row click
    $('.dropdown-menu').show();

    //now show hover icons for dropdowns
    $('.glyphicon-eject').show();
});

http://jsfiddle.net/YSmK7/6/

Answer 1

因此，如果您最初取消dropdown课程将停止下拉列表。如果在单击后添加dropdown类，则会激活下拉列表。

您所在的任何地方<li class="dropdown">将其更改为<li class="beforedropdown">

HTML

<li class="beforedropdown"> <a href="#" class="dropdown-toggle"

jQuery

$('table tr').click(function(){
   //now show hover icons for dropdowns
   $('.glyphicon-eject').show();
   $('.beforedropdown').addClass('dropdown');
});

http://jsfiddle.net/YSmK7/8/

<强>更新

如果您不希望能够点击链接以显示下拉菜单，则需要执行以下操作。

<a href="#" class="dropdown-toggle" data-toggle="">

从您的data-toggle个所有链接中删除所有.dropdown-toggle的值。

http://jsfiddle.net/YSmK7/9/

Answer 2

尝试使用.toggle()方法代替.show() 或者将.hide()绑定到应删除菜单的事件，例如mouseout（）。

只有在点击后才启用下拉菜单？

2 个答案: