Question

我在下拉列表中遇到问题，我希望在下拉列表卷起时，所选列表元素处于活动状态。目前，当它放在主容器中时，dropwdown会以这种方式工作，但是当下拉列表放在div（称为aBox2）中时，js无法工作！

这是我的javascript应该使下拉列表工作：

$(".dropdown-menu li a").click(function(){
    var selText = $(this).html();
    $(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="caret"></span>');
});

我把我的代码放在这个小提琴中，抱歉脚本不能正常工作，（它们在我常用的编辑器中工作），但至少你会看到我的代码是什么样的。

提前致谢！

的jsfiddle： http://jsfiddle.net/level27/eL9dd/

Answer 1

你的jsFiddle中有两个不相关的错误。

以下是更新的小提琴：http://jsfiddle.net/eL9dd/4/ 现在下拉工作了。

我刚评论说：

//  $("[bootstrap-switch]").bootstrapSwitch();

并将bootstrap.min.js移动到外部资源的末尾，以便在jQuery之后加载。

出于某种原因，你有风格：

#aBox2 {
  display: none;

隐藏此div及其中的下拉列表。

删除＃aBox2中的display: none;下拉列表时按下小三角形按钮的按钮正确打开，但按下标有“操作”的按钮时则不能。

请在此阅读有关如何正确构建下拉触发按钮的信息： http://getbootstrap.com/2.3.2/components.html#buttonDropdowns

基本上，您需要在.btn-group中只有一个按钮以及下拉<ul>。如果你有更多只有最后一个似乎工作。

以下是#aBox2显示的最终示例，操作按钮与小三角按钮合并并激活。

http://jsfiddle.net/eL9dd/5/

下拉列表在div中不起作用

1 个答案: