Question

我正在使用jQuery Ui在我的网络应用程序中选择列表项。在这个列表中的每个项目中，我有一个下拉按钮。当我将可选选项添加到列表时，由于项目（按钮的父项）被选中，因此下拉选项不会打开，并且该按钮不再可单击，就像可选择的选项“隐藏”可点击性一样按钮。我该如何解决？我的代码如下所示：

<ul ui-selectable>
<li data-ng-repeat="item in items | filter:filterText">
   <div type="button" class="dropdown " >
       <a class="dropdown-toggle " id="dLabel" role="button" data-toggle= "dropdown" data-target="#" ng-href="/page.html">aaa
       </a>
       <ul class=" dropdown-menu " role="menu" >
           <li > ng-href="#" >blabla1</a></li>
           <li > ng-href="#" >blabla2</a></li>
           <li > ng-href="#" >blabla3</a></li>

       </ul>
    </div>
</li>

Answer 1

首先，您的代码缺少一些部分。见下面的评论。

我把你所拥有的东西清理干净了：

<ul ui-selectable>
<li data-ng-repeat="item in items | filter:filterText">
    <div type="button" class="dropdown "> <a class="dropdown-toggle " id="dLabel" role="button" data-toggle="dropdown" data-target="#" ng-href="/page.html">aaa
   </a>

        <ul class=" dropdown-menu " role="menu">
            <!-- You were missing the <a in front of each ng-href -->
            <li> <a ng-href="#">blabla1</a>
            </li>
            <li> <a ng-href="#">blabla2</a>
            </li>
            <li> <a ng-href="#">blabla3</a>
            </li>
        </ul>
    </div>
</li>
<!-- You were missing a closing ul -->
</ul>

您可以查看它正常工作here on js fiddle

我在资源中添加了以下内容，它对我有用：

http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js

http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css

在列表中的可选项目中创建下拉按钮

1 个答案: