jQuery 如何禁用引导程序下拉列表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19589316/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I disable bootstrap dropdown list
提问by user2873816
I made a dropdown list using bootstrap.Dynamically I want to disable and enable the dropdown list.
我使用 bootstrap.Dynamically 制作了一个下拉列表，我想禁用和启用下拉列表。
html code:
html代码：
<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>
<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>
some times I want to disable and sometimes I want to enable.So How can I do this.
In this I have 2 more dropdown elemnts.All are placed in singlw divtag.Here I didn't mention that divtag id name.I just putted single dropdown element code.
有时我想禁用，有时我想启用。所以我该怎么做。在此我还有 2个下拉元素。所有元素都放在 singlw标签中。div这里我没有提到div标签 ID 名称。我只是放了单个下拉元素代码。
回答by JERRY-the chuha
Yes, by jquery you can get this:
是的，通过 jquery 你可以得到这个：
Here is the example:
这是示例：
$(document).ready(function() {
$("#chkdwn2").click(function() {
if ($(this).is(":checked")) {
$("#dropdown").prop("disabled", true);
} else {
$("#dropdown").prop("disabled", false);
}
});
});
UPDATEDJS CODE as per your need:
根据您的需要更新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);
}
});
});
Replace dropdownid with your id. Thanks
将dropdownid替换为您的 ID。谢谢
回答by Sridhar R
By using jquery we can do
通过使用 jquery 我们可以做到
Disable Dropdown
禁用下拉菜单
$('.select_alert').attr('data-toggle','');
Enable Dropdown
启用下拉菜单
$('.select_alert').attr('data-toggle','dropdown');
回答by rajkjaiswal
You can do this by add if block on the property and add disabled class to the drop down.
您可以通过在属性上添加 if 块并将禁用的类添加到下拉列表中来完成此操作。
below is my div in that i have eanbled/disabled dropdown toggle button on IsNewEditDisabled
下面是我的 div，因为我在 IsNewEditDisabled 上启用/禁用下拉切换按钮
<button ng-if="!IsNewEditDisabled" class="btn dropdown-toggle" ng-class="{open: status.isopen}" dropdown-toggle>
<i class="fa fa-pencil"></i><span class="caret"></span>
</button>
<button ng-if="IsNewEditDisabled" class="btn dropdown-toggle disabled" ng-class="{open: status.isopen}" dropdown-toggle>
<i class="fa fa-pencil"></i><span class="caret"></span>
</button>
