禁用下拉按钮中的值

时间:2018-01-24 11:30:13

标签: html angularjs drop-down-menu angular-ui-bootstrap dropdown

我在下拉列表中有一些值,但我想禁用其中一些值。

Here我找到了一个解决方案,如果我们向<a>添加禁用的样式,它将被禁用。我为下拉元素B尝试了相同但它没有工作。

如果我在某处错了,请帮助。

请参阅以下代码段以供参考,

<div class="dropdown">
   <button class="fa fa-plus plusIcon dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    </button>
    <div class="dropdown-menu pull-right">
        <span class=" fa fa-cube dropdown-header"> Dropdown Values </span>
        <span class="divider"></span>
        <a class="dropdown-item">A</a>
        <a class="dropdown-item disabled">B</a>
        <a class="dropdown-item">C</a>
    </div>
</div>

2 个答案:

答案 0 :(得分:1)

尝试使用列表项。为我工作

<ul class="dropdown-menu pull-right">
      <li><a href="#">Normal</a></li>
      <li class="dfgdfgdf disabled"><a href="#">Disabled</a></li>
      <li class="active"><a href="#">Active</a></li>
      <li><a href="#">Normal</a></li>
</ul>

答案 1 :(得分:0)

  1. 检查您的lib js和css参考
  2. 只需添加href="#"
  3. 即可

    它工作正常。

    &#13;
    &#13;
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js"></script>
    
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
    <div class="dropdown">
       <button class="fa fa-plus plusIcon dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">dropdown
        </button>
        <div class="dropdown-menu pull-right">
            <span class=" fa fa-cube dropdown-header"> Dropdown Values </span>
            <span class="divider"></span>
            <a class="dropdown-item" href="#">A</a>
            <a class="dropdown-item disabled" href="#">B</a>
            <a class="dropdown-item" href="#">C</a>
        </div>
    </div>
    &#13;
    &#13;
    &#13;