如何禁用引导下拉列表

新手上路,请多包涵

我使用 bootstrap 创建了一个下拉列表。我想动态地禁用和启用下拉列表。

代码:

   <div class="span3 offset1">
        <select name="primary" class="select-block" id="select_alert" style="display: none;">
            <option "selected"="">Choose Alert T</option>

    <option value="T1">T1</option>

    <option value="T2">T2</option>

    <option value="T3">T3</option>

    <option value="T4">T4</option>

</select>
<div class="btn-group select select-block">
  <i class="dropdown-arrow dropdown-arrow-primary"></i>
  <button class="btn dropdown-toggle clearfix btn-primary" data-toggle="dropdown" id="select_alert">
    <span class="filter-option pull-left">Choose Alert T</span>&nbsp;
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu dropdown-primary" role="menu">
    <li rel="0" class="selected">
      <a tabindex="-1" href="#" class="">
        <span class="pull-left">Choose Alert T</span>
      </a>
    </li>
    <li rel="1">
      <a tabindex="-1" href="#" class="">
        <span class="pull-left">T1</span>
      </a>
    </li>
    <li rel="2">
      <a tabindex="-1" href="#" class="">
        <span class="pull-left">T2</span></a>
    </li>
    <li rel="3">
      <a tabindex="-1" href="#" class="">
        <span class="pull-left">T3</span>
      </a>
    </li>
    <li rel="4">
      <a tabindex="-1" href="#" class="">
        <span class="pull-left">T4</span>
      </a>
    </li>
  </ul>
  </div>
</div>

有时我想禁用,有时我想启用。所以我该怎么做。在此我还有 2 个下拉元素。所有都放在 singlw div 标签中。这里我没有提到 div 标签 ID 名称。我只是放了单个下拉元素代码。

原文由 user2873816 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 174
1 个回答

是的,通过 jquery 你可以得到这个:

这是示例:

http://jsfiddle.net/jV7ye/

 $(document).ready(function() {
    $("#chkdwn2").click(function() {
       if ($(this).is(":checked")) {
          $("#dropdown").prop("disabled", true);
       } else {
          $("#dropdown").prop("disabled", false);
       }
    });
});

根据您的需要 更新 JS 代码:

 $(document).ready(function() {

        if(!$("#chkdwn2").is(":checked"))
        {
            $("#dropdown").prop("disabled",true);
        }

        $("#chkdwn2").click(function() {
           if ($(this).is(":checked")) {
              $("#dropdown").prop("disabled", false);
           } else {
              $("#dropdown").prop("disabled", true);
           }
        });
    });

用您的 ID 替换 dropdown id。谢谢

原文由 JERRY-the chuha 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题