Question

我在插件jOrgChart的div中有一个twitter bootstrap下拉列表。

我遇到的问题是，当我单击按钮打开下拉菜单时，它还会触发父div中的单击事件，该事件会导致其他元素崩溃。

这是我的HTML：

<div id="chart">
<div class="node">
    <div class="btn-group">
        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        Actions
        <span class="caret"></span>
        </a>
        <ul class="dropdown-menu" style="text-align:left;">
            <li><a href="#">Edit</a></li>
            <li><a href="#">Delete</a></li>
        </ul>
    </div>
</div>

<div class="node">
...
</div>

我想阻止点击a.dropdown-toggle从冒泡到div.node，我尝试了这个：

$("div#chart div.btn-group > a.dropdown-toggle").click(function (e) {
            e.stopPropagation();
        });

但现在下拉列表无效。

修改

这是具体案例：http://jsfiddle.net/UTYma/2/（感谢Joe Tuskan开始小提琴）

Answer 1

$("#orgchart").jOrgChart({ chartElement: '#chart' });

$("div#chart div.btn-group > a.dropdown-toggle, .dropdown-menu li a").click(function(e) {
    e.stopPropagation();
    $('.dropdown-menu').toggle();
});

停止传播，然后切换。 Example

<小时/> 我必须将下拉菜单项添加到单击处理程序以保持行为不变。

Answer 2

尝试这样的事情：

$("div#chart div.btn-group > a.dropdown-toggle").click(function (e) {

            e.isDropDownToggleEvent =true;
})

然后：

$("div.node").click(function (e) {
     if (e.isDropDownToggleEvent != null && e.isDropDownToggleEvent)
         return false;

     return true;      
})

您也可以尝试使用e.preventDefault（）或e.stopPropagation（）;而不是返回false。

Answer 3

我用过

$('.multiselect').on('click', function (e) {
    $(this).next('.dropdown-menu').toggle();
    e.stopPropagation();
});

这类似于@ Joe的答案，但更通用

Answer 4

$("div#chart div.btn-group > a.dropdown-toggle, .dropdown-menu li a").click(function(e) {
    e.stopPropagation();
    $(this).closest('.dropdown').toggleClass('open');
});

您应该使用此代码，因为上述解决方案不会关闭焦点上的下拉列表。

Answer 5

如果我理解正确，你想避免关闭菜单。

$("div#chart .dropdown-menu li").bind('click',function (e) {
            e.stopPropagation();
        },false);

Answer 6

以Joe的回答为基础，其中包括在下次单击时关闭的常规下拉功能。

doc.load(@"C:\testing_doc.txt");

XmlNodeList values = doc.SelectNodes("testing/test/text");  //Using XPath

string str = string.Empty;

    foreach (XmlNode x in values)
    {
        str += x.InnerText + ",";
    }

str.TrimEnd(',');

Console.WriteLine(str);   //test1,test2

Twitter引导程序在下拉列表中停止传播

6 个答案: