Bootstrap子菜单单击事件不适用于jQuery

时间:2014-11-03 09:39:47

标签: jquery twitter-bootstrap nav submenu

我有以下Bootstrap子菜单结构:

<ul class="dropdown-menu">
    <li class="submenu-open">
        <a href="http://google.com"><span class="dropdown-sub-toggle"></span>Some Text</a>
        <ul class="collapse dropdown-submenu">
            <li> 
                <a href="http://google.com">Some Text</a>
            </li>
        </ul>
    </li>
</ul>

单击span标签时菜单会折叠 - 它是右边的箭头。我需要在点击时将一些文本添加到span标签,但我不能用jQuery选择它 - $('.dropdown-sub-toggle').click(function({...}))不起作用。我怎样才能使它发挥作用?

1 个答案:

答案 0 :(得分:1)

$(".submenu-open").on('click', function(e){
    e.preventDefault();
});

$(".dropdown-sub-toggle").on('click', function(e){
    $(this).prepend("Some Text");
});

这对我有用。

您还可以添加stopProgagation()。

$(".dropdown-sub-toggle").on('click', function(e){
    e.stopPropagation();
    $(this).prepend("Some Text");
});

防止事件冒泡。

看不出为什么这样做不起作用的任何其他原因。