Popover 中的级联下拉列表

Question

我在弹出框内实现下拉菜单时遇到问题。我查看了 bootstrap 文档并尝试了所有方法，从弄乱数据切换 类 到尝试让它工作，但什么也没发生。

在第一个 link 中，我有一个级联下拉菜单，在单击 link 后可以使用。 LINK1

但是在这个link中，我试图将与link1中的代码相同的内容放入弹出窗口中，但它失去了层叠的能力。 LINK2

我研究了如何解决这个问题，要么通过实施手动点击处理程序，要么使用下拉切换，但没有成功。更具体地说，我不确定是否需要对其他子下拉菜单应用相同的 类，就像我对这个下拉菜单所做的那样：

<a href="#" class="dropdown-toggle" data-toggle="dropdown">
Click Here <span class="caret"></span></a>

提前致谢。

Answer 1

问题是弹出窗口会在 DOM 中用弹出窗口内容创建一个新的 div，所以在你的 js 中你已经将点击事件分配给了一个从未使用过的元素。如果您检查代码，您会看到有两个 "click here" 锚点。要解决您的问题，您必须使用不同的形式分配事件点击。我为你创建了一个新的 jsfiddle http://jsfiddle.net/nB4U6/1016/ 要将事件分配给将来创建的元素，您必须使用此表单

$(staticAncestors).on(eventName, dynamicChild, function() {});

在你的情况下我已经改变了这个

$(".dropdown-menu > li > a.trigger").on("click", function(e) {});

有了这个

$('body').on("click",".dropdown-menu > li > a.trigger",function(e){});

事件将绑定到已经存在的正文。