单击disabled Bootstrap单选按钮组按钮将从当前删除活动
。
在Bootstrap中，disabled属性用于禁用按钮或其他表单元素，使其无法被点击或编辑。对于单选按钮组，当某个按钮被禁用(disabled)时，点击该按钮将从当前选中的活动中删除。
这种功能在一些特定场景下非常有用，例如在表单中，当某个选项不可用时，可以将其从当前选中的活动中移除，以确保用户选择的是有效的选项。
在实际应用中，可以通过以下步骤实现单击disabled Bootstrap单选按钮组按钮将从当前删除活动的功能：
- 使用Bootstrap的单选按钮组组件创建一个包含多个按钮的按钮组。
- 在需要禁用的按钮上添加disabled属性，使其变为禁用状态。
- 使用JavaScript或jQuery监听按钮的点击事件。
- 在点击事件处理程序中，判断被点击的按钮是否被禁用。
- 如果被点击的按钮被禁用，将其从当前选中的活动中删除。
以下是一个示例代码：
HTML代码：
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary active">
<input type="radio" name="options" id="option1" autocomplete="off" checked> 活动1
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option2" autocomplete="off"> 活动2
</label>
<label class="btn btn-primary">
<input type="radio" name="options" id="option3" autocomplete="off" disabled> 活动3
</label>
</div>JavaScript代码：
$('.btn-group .btn').click(function() {
if ($(this).find('input').is(':disabled')) {
$(this).removeClass('active');
}
});在上述示例中，按钮组包含三个按钮，其中第三个按钮被禁用(disabled)。当用户点击第三个按钮时，JavaScript代码会检查该按钮是否被禁用，如果是，则将其从当前选中的活动中移除（移除active类）。
需要注意的是，以上示例中没有提及具体的腾讯云产品和产品介绍链接地址，因为在这个特定的功能实现中，并不需要使用到云计算相关的特定产品。
相关·内容
3回答
禁用单选按钮组中的按钮
、、、、
我有一个单选按钮组，我想要动态启用/禁用按钮。
这是单选按钮组代码：
$("#option1").prop("disabled", true);
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js&
浏览 20提问于2016-08-31得票数 4
回答已采纳
我使用onCheckedChangeListener将结果返回给MainActivity并完成当前的活动。但是如果用户决定使用默认的选定值，他想要重新单击单选按钮来保存结果。我该怎么做呢？谢谢
编辑:简而言之，我如何知道用户是否选择了一个已经选中的单选按钮？
浏览 1提问于2013-07-06得票数 0
1回答
引导单选按钮结果
、、、、
基于下面的HTML代码片段，设法获得两行单选按钮。当您单击第一行上的单选按钮，然后继续单击第二行上的任何单选按钮时，第一行上的单选按钮的结果将消失。如何确保单选按钮的两行结果一起出现。
<!-- Start first Div -->
<div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="inlineRadioOptions" id=&
浏览 0提问于2020-09-14得票数 0
我正在使用bokeh单选按钮与单一标题。最初它是非活动的，当我单击单选按钮时，它变为活动状态，但如果我再次单击活动状态，它不会更改为非活动状态。 如何获得此功能？？
浏览 22提问于2019-05-10得票数 0
这对于一组3个单选按钮非常有效：
$("input:radio").click(function() {
$(this).siblings("input:radio").attr("disabled","disabled");
});
为了更进一步，我有3组3个单选按钮：
1 2 3
1 2 3
1 2 3
如果用户检查第一行的数字1，我希望它禁用第二行的数字1和three...basically，我给用户每行3个选择，我希望他们对它们进行排名，并希望所有排名都不同。讲得通?
这个是可能的吗？
浏览 2提问于2011-03-06得票数 1
2回答
我有一个文本字段和其他三个单选按钮。
我必须添加捐赠金额，无论是从文本框中填写自定义金额，还是通过单击具有固定值的单选按钮。
<input type="radio" name="type" value = '1'>$1<br>
<input type="radio" name="type" value = '5'>$5<br>
<input type="radio" name="type" value = '
浏览 5提问于2017-03-14得票数 2
所以我得到了这段代码，当我单击一个单选按钮时，我希望这些单选按钮在它们被裁剪并被禁用时被取消单击。
到目前为止，它们被禁用了，但是它们并没有被取消点击？
if (document.getElementById("None").checked) {
document.getElementById("HundredsAndThousands").clicked = false;
document.getElementById("ChocolateSprinkles").clicked = false;
document.get
浏览 2提问于2013-05-04得票数 1
回答已采纳
3回答
我有一组具有相同name的单选按钮，其中一些可能被禁用。我不希望用户选中或取消选中禁用的单选按钮。显然，这意味着如果组中选中的单选按钮被禁用，用户将无法更改选择。
为此，我编写了以下代码。
$("#container").delegate(":radio","click",function(e){
alert($(":radio").filter(":checked").val());
//this always shows up the value of the radio button clic
浏览 4提问于2011-06-06得票数 2
回答已采纳
1回答
我希望我只是错过了一些简单的东西，因为我已经看了很长时间了，但我很困惑。
我有一个输入绑定到vuejs的表单。我有一组2个单选按钮，用于选择“性别”，而且绑定工作非常完美。如果单击任一单选按钮，则可以在vue组件检查器中看到数据更改。
但我正在尝试将单选按钮更改为一个引导4按钮组，并且似乎无法使v-模型绑定工作。无论我尝试什么，当我单击按钮组中的任何一个按钮时，vue数据中的gender_id都不会更新。
表单输入值是通过vue组件属性输入的，但为了简单起见，单选按钮/按钮组的数据如下所示：
export default {
data() {
return {
浏览 0提问于2018-03-21得票数 13
回答已采纳
我有一组带有lase选项"Other“的单选按钮和一个输入field type text。默认情况下，输入字段是禁用的，如果单击“其他”单选按钮，则该字段将被启用。如果选择单选按钮被更改，如何禁用输入字段？
这是我的密码：
$(document).ready(function(){
$("#text-inputt").prop('disabled', true)
});
$("#lastt").click(function(){ $("#text-inputt").prop('disabled'
浏览 0提问于2016-04-04得票数 0
回答已采纳
1回答
在创建Android应用程序时，我想创建一个函数，允许您在从片段创建的对话框窗口中设置暗模式。由于找到了设置暗模式的方法，几乎所有的开发人员都使用重新启动活动。有没有一种不用重启就能立即应用暗模式的方法？这是对话框窗口中的暗模式应用程序代码，位于我当前使用的片段中。 class MyFragment : Fragment() {
private var dialog: AlertDialg? = null
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInsta
浏览 50提问于2020-07-06得票数 2
1回答
我有两个具有依赖性的单选按钮组。
单击按钮1时，应禁用按钮4和5，反之亦然。如果单击Button 2，则Button 4和5处于活动状态，Button 3被禁用。
如何向禁用按钮添加帮助文本，这些按钮说明由于您在组A(组织)中的选择而禁用了按钮。
下面是处理按钮的javascript。
$(document).on('click', function () {
// Organization and Data Classification dependency
if($('#edit-field-organization-und-0').is(&
浏览 0提问于2018-02-28得票数 0
我有两个单选按钮。(是和否)
单击Yes -- Next按钮应处于活动状态(.btn-primary)颜色应为蓝色
单击NO -- p标记应该是可见的，并且next按钮应该被禁用(它应该在那里，但将处于非活动状态)
我能让你
tab visible..but而不是btns
链接到
$('#radio1').change(function(){
if ($(this).is(':checked')) {
$('#notes-sp').addClass('hide');
}
});
浏览 0提问于2013-06-06得票数 0
在<form>中，我有带单选按钮的Bootstrap 3按钮组。我希望能够让组中的多个按钮同时处于活动状态。我的意思是，在水果按钮组中，应该有人能够单击苹果，然后单击橙子，(1)都保持活动状态，(2)让表单发送该组的两个值。
到目前为止，Html看起来像这样：
<div class="container">
<br><p>Click all the fruits that you like</p>
<div class="btn-group col-xs-12" data-togg
浏览 1提问于2014-09-17得票数 5
回答已采纳
当选择单选按钮时，我试图激活一组select下拉列表，而当另一个按钮被选中时，我试图激活一组select下拉列表。
jQuery:
$(':radio[name!="hours"]').change(function() {
if ($(this).filter(':checked').val() == "open") {
$(this).nextUntil("input","select").attr("disabled", false);
} else {
浏览 1提问于2013-07-11得票数 1
回答已采纳
2回答
我有一门课，它的价值是
<span class="price-value">0</span>
还有一个单选按钮类
class="radio-livraison element-radio-input" disabled="disabled"
可以禁用单选按钮，并且只有当总数超过28时才能启用单选按钮；例如，如果span价格值小于28，则不能检查单选按钮。
<script>
if ($('.ezfc-price-value') > 24){
$('.ly-radio-li
浏览 0提问于2018-03-09得票数 0
回答已采纳
1回答
我想要一个可切换的按钮组，因此使用标签和输入作为输入组。该功能是这样的:在单击禁用状态标签时，用户应该看到禁用状态警报，然后禁用自身并切换以使另一个按钮处于活动状态。我注意到Bootstrap添加了活动的类，并将注意力集中在标签的单击上，使其看起来是活动的。所以我试着用代码来删除这两个类，但是它似乎不能像预期的那样工作。
<div id='btnGroupFrequencyCI' class="btn-group btn-group-justified" data-toggle="buttons">
<label c
浏览 12提问于2016-08-31得票数 1
1回答
我正在尝试在一个测验android应用程序中使用单选按钮。我在编码时遇到了一个奇怪的问题。当我选择第一个单选按钮作为第一个选项时，然后单击显示下一个问题的下一个按钮，并将第一个单选按钮设为setChecked(false)。在此之后，对于第二个问题，第一个单选按钮不起作用，直到我选择另一个单选按钮，然后它将是活动的和可选的。这显然是UI上的一个问题，在您的帮助下，我确实想摆脱这个问题。提前使用Tnx。
浏览 0提问于2017-03-21得票数 0
3回答
在下面的代码中，用户必须选择是否有汽车和单选按钮。如果“是”单选按钮被设置为“汽车名”输入字段，则启用“没有”单选按钮“汽车名称”输入字段被禁用，则有一个“测试”按钮，当单击“是”单选按钮时，设置了“是”单选按钮，但与“是”单选按钮关联的函数不会被触发。
请解释为什么单击“测试”按钮时与“是”单选按钮相关的函数不被触发？
有办法做到这一点吗？当单击“测试”按钮时，应该设置“是”单选按钮，这将触发函数enable_carname。
<!DOCTYPE html>
<html>
<body>
<h2>Radio Buttons</h
浏览 1提问于2018-11-25得票数 0
回答已采纳
1回答
我制作了一个带有两个单选按钮和两个文本框的窗体，当一个单选按钮被单击时，一个文本框被启用，另一个将被禁用。但是，在单选按钮被单击之前，如何在开始时选中该单选按钮呢？
下面是我的代码，它将在单选按钮被单击时启用文本框：
<input onclick="document.getElementById('agree_ad').disabled = false; document.getElementById('agree_bs').disabled = true;" type="radio" name="type1"
浏览 4提问于2016-03-01得票数 3
1回答
单选按钮onclick不改变值。
、、、、
我正在尝试执行下面的JS。我有一个单选按钮，单击该按钮应该将变量RefreshMapping的属性设置为以下代码中指定的子属性。然而，这似乎不起作用。我已经将RefreshMapping的默认值设置为template，每次我选择单选按钮时，该值都应该更改为子值，而不是。任何帮助都将不胜感激。
</script>
<SPAN nowrap>
<body>
<table cellpadding='0' cellspacing='0' width=''>
<tr>
<td clas
浏览 4提问于2014-02-17得票数 0
回答已采纳
我正在使用bootstrap 3.3.6，并且我正在尝试禁用这种类型的无线电btn组。我试过在标签和输入上都放置残障人士，但似乎不起作用。这些按钮将显示为禁用状态，但仍可单击。每当我单击这些按钮时，就会添加一个活动类。
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-default disabled">
<input type="radio" class="toggle" value=
浏览 38提问于2017-01-11得票数 3
1回答
我正在尝试创建一些参数筛选器，但我不希望在已经选择单选按钮筛选器时调用进行搜索AJAX调用的函数。
$('#contentType input:enabled').bind('click', function(e){
var $this = $(this),
$type = this.type,
$id = this.id;
if ($type === 'radio') {
if ($id === 'allContent'){
sFrm.$bo
浏览 4提问于2011-07-12得票数 0
回答已采纳
我在搜索过滤系统中有一系列的引导单选按钮。所有的工作都与一系列onchange和onclick事件相关联。
我遇到的问题是当我运行搜索并重新填充所有的无线滤波器时。bootstrap单选按钮以相同的标准输出，并将checked="checked"添加到所选的单选按钮。然后，我将相关标签设置为活动的，并模拟一个单击触发事件。这将运行一系列对界面至关重要的事件。
$('input[type="radio"]:checked').parent('label').addClass('active');
//simulate
浏览 1提问于2013-10-04得票数 0
如果我右键单击某个单选按钮，我想清除组中的所有单选按钮。我如何使用Javascript实现这一点？
浏览 1提问于2010-04-16得票数 1
回答已采纳
我有这个简单的演示来测试bootstrap modal和JSON。
当我单击按钮"show“时，它加载JSON并对其进行解析。"Launch demo modal“按钮显示解析后的JSON。
但是当我再次单击按钮"show“时，模式中的前一个列表并没有被删除，它会追加增加模式大小的当前列表。
我想在每次单击“显示”按钮时刷新缓存。
请帮帮忙。
浏览 0提问于2013-07-18得票数 0
回答已采纳
我在使用JQuery处理多个单选按钮组时遇到了问题。由于某些原因，JQuery代码不能区分这两组单选按钮，也不能说出我单击的是哪组单选按钮。
下面是HTML代码：
<!-- Radio button group 1 -->
<input type="radio" name="group_1" value="full_day_ticket"/>
<input type="radio" name="group_1" value="half_day_ticket"/>
浏览 0提问于2009-11-23得票数 1
回答已采纳
2回答
我有这样的按钮：
<button value="1" name="submit" disabled="true" id="signup-bb" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-disabled ui-state-disabled ui-button-text-only" role="button" aria-disabled="true">
单击该页面上的某个单选按钮后
浏览 3提问于2011-03-20得票数 0
引导我的项目。我的JavaScript代码如下：
<OverlayTrigger trigger="click" placement="right" overlay={<Popover ><strong>Gender: </strong>Please select your gender</Popover>}>
<input className="col-sm-1 col-xs-1" type="radio" name="
浏览 10提问于2016-07-18得票数 1
2回答
如何确定在使用单击单选按钮时选中哪个单选按钮
无论选择哪个单选按钮，以下是对false的评估：
HTML
<div class="btn-group" data-toggle="buttons" id="disabled-radio-btn">
<label class="btn btn-default">
<input type="radio" name="disabled" id="disabled-yes">Yes
浏览 0提问于2017-04-13得票数 3
回答已采纳
我有以下html：
<input type="text" class="searchpersontxtbox" />
<input type="button" value="Find" class="findpersonbtn btn" disabled="disabled" />
<img class="loader" style="display: none;" alt="Loading..."
浏览 0提问于2013-03-11得票数 0
回答已采纳
从下图中
，我想隐藏第二个按钮，
使用javascript，我需要让第一个按钮有圆角。
在我使用javascript隐藏第二个按钮后，第一个按钮在右侧有一个矩形形状：
如果我删除了按钮节点，bootstrap会设置圆角，但这没有什么用处。
这就是我所需要的，通过使用javascript：
标准的bootstrap html按钮结构：
<div class="btn-group">
<button class="btn btn-mini action_select customSelect" id=&
浏览 0提问于2013-05-21得票数 4
回答已采纳
2回答
我正在尝试实现类似于历史页面的功能，动态禁用一系列的单选按钮。
即..。如果选择第二组中的#4，则禁用第一组中的1-4，依此类推。
我知道如何单独或作为一个组禁用它们，但我不确定如何在一系列比方说1-4中这样做：
单独：
$("#version_history input[id^=versions_2_3]:radio").attr('disabled',true);
或组：
$("#version_history input[id^=versions_2]:radio").attr('disabled',true);
输入被命名
浏览 3提问于2010-04-30得票数 1
现在的问题是，我有两个radio-button__s，，我想要的是，当您单击 admin 单选按钮时，您可以看到一个表单，当您单击 user 单选按钮时，您可以看到另一个表单。到目前为止，这两个表都被选中了，我不知道为什么，只希望默认情况下检查一个，并且每次都显示一个表单()
下面我将张贴无线电的代码和他们的照片。我在用angular-material。
单选按钮的html
<mat-radio-group aria-label="Select an option" class="center">
<mat-radio-bu
浏览 0提问于2020-02-16得票数 1
回答已采纳
2回答
我刚刚创建了mvc 4应用程序。这里是那个项目的一个表的视图。
我想禁用当前活动的可点击功能。
例如：
禁用第一行活动按钮的单击功能，启用非活动按钮的单击功能
和
禁用第二行非活动按钮的单击功能，启用活动按钮的单击功能
其他的也一样。
在这里，这个表视图按钮函数的当前cshtml代码
<div class="btn-group btn-toggle" id="btn-toggle">
@if (item.Status == true)
{
<button class="btn btn-xs activ
浏览 0提问于2015-05-15得票数 2
我试图启用和禁用单选按钮取决于另一个单选按钮。当用户单击特定日期时，单选按钮就可以启用该日期的时隙。例如，当用户点击日期16-03-2019时隙16-2019 8:30和下午1:30时，应该启用。其他时间17-03-2019年的单选按钮被禁用。
以下是代码：
<tr><td><input class="slot" type="radio" name="date" required="" value="16-03-2019">16-03-2019</td>
&
浏览 1提问于2019-03-06得票数 1
回答已采纳
1回答
我有一些关于Bootstrap 3单选按钮组的问题。
当我选择单选按钮时，它并没有将单选按钮标记为选中，它只是将“活动”添加到单选标签中。
因此，当我尝试通过PHP和Codeigniter拉出选中的单选按钮时，特别是没有值。
单选按钮不应该像正常的单选按钮那样工作吗？
下面是单选按钮代码
<div class="form-group">
<label for="Custom Branding">Custom Branding</label><br />
<div class="btn-
浏览 1提问于2016-04-19得票数 0
1回答
我有一个无线电组，其中有三个单选按钮，用于图像、音频和视频。
现在，该布局将被禁用，当用户单击“显示选项”时，这将是启用的，默认情况下，它应该设置“检查图像”单选按钮，但它不起作用。
请检查下面的代码，并帮助我。
public void onClick (View v)
{
switch (v.getId)
{
case R.id.btnOptions :
rb_images.setEnabled(true);
rb_audio.setEnabled(true);
浏览 2提问于2016-05-24得票数 1
回答已采纳
我有两个带有单选按钮的文本字段。
当我点击第一个按钮时，该文本字段应该是活动的，而其他文本字段应该是非活动的。
但是，当我单击第二个按钮时，两个文本字段都处于活动模式。
我只需要一个字段应该是活跃的点击按钮和其他应该是在非活动模式。
我有这个HTML代码
<form name="myform" action="">
<input type="radio" id="yourBox" value="text1" style="margin-left: 15px; margin-rig
浏览 6提问于2015-05-30得票数 2
回答已采纳
我有一行自定义单选按钮，如果选中它们，它们会改变大小。默认情况下，第一个按钮是选中的，当我单击另一个按钮时，bootstrap应该添加.active类，问题是这个类没有被显著添加，因为我删除了jquery bootstrap库。我如何在纯javascript中做到这一点？我试着用简单的CSS
CSS
.step {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
color: #fff;
cursor
浏览 3提问于2019-12-16得票数 1
6回答
我有两个单选按钮
Popular
Others
两个按钮
Edit
Cancel
最初，当我单击“编辑”按钮时，单选按钮将被禁用，当我再次单击“取消”按钮时，应禁用单选按钮。
目前，我只能启用当我点击编辑按钮，但我没有禁用它，当我点击取消按钮，可以帮助我实现它感谢！
<div>
<label>
<input id='r_popular' class='pop_others' type='radio' name='section_pop_others' disabled
浏览 13提问于2015-10-30得票数 1
我目前在一些单选按钮上使用jQuery。当用户单击某个单选按钮时，将调用一个函数，该函数从所有其他单选按钮中删除checked属性，并禁用与其他单选按钮关联的输入字段。例如，当点击一个单选按钮时，
function EnableRadio1() {
$('#x :input').attr('checked', false).attr('disabled', true);
$('#y :input').attr('checked', false).attr('disabled',
浏览 0提问于2011-03-18得票数 0
回答已采纳
我正在尝试使ID仅在选中特定类型的单选按钮时激活。下面是我的jQuery代码：
$(document).ready(function() {
$('#Type').attr('disabled', 'disabled');
$('input[@name=action]').change(function() {
if ($("input[@name=action]:checked").val() == 'SomeKind')
$(&#
浏览 0提问于2010-11-30得票数 3
回答已采纳
2回答
我一直试图动态地将类设置为单选按钮，但我无法这样做。我正在维护一个带有单选按钮的开关，“已启用、挂起、禁用”。基于单选按钮选择，我试图分配类名来更改颜色。
我会感谢你的帮助。
沙箱：
应用程序
import React from "react";
import ReactDOM from "react-dom";
import "./styles.css";
class App extends React.Component {
constructor(props) {
super(props);
this.state =
浏览 1提问于2019-08-16得票数 0
回答已采纳
我有一个超链接代码，如:单击此处，并且我想根据我的单选按钮单击自定义这个链接，这类似于: YES NO on单选按钮值：‘是’，我想启用超链接。在单选按钮值：“否”时，我想禁用超链接。因此，为了使超链接在单击单选按钮“NO”后禁用，我用disable ()方法编写了以下内容:函数disable(){document.getElementById(‘disable’).href= '#'；}现在，我必须用启用-链接()方法编写的内容，以便在单击单选按钮'YES‘后重新启用超链接。
function enable-link()
{
//document.getEle
浏览 1提问于2012-11-01得票数 0
回答已采纳
2回答
当选择IP和其他单选按钮时，我希望启用文本框。我想禁用另一个单选按钮选择。
对IP很好，但我不能让它为另一个工作。有没有人？
function EnableDisableTextBoxNext() {
var chkYes = document.getElementById("chkYes");
var addMoreDetailsNext = document.getElementById("addmoreDetailsOnSelection");
addMoreDetailsNext.disabled = chkYes.check
浏览 5提问于2020-12-17得票数 0
回答已采纳
我有以下几点：
<div class="attributes_set_1>
<label class="attributes"><input type="radio" value="1" /></label>
<label class="attributes"><input type="radio" value="2" /></label>
<label class="attr
浏览 1提问于2013-12-16得票数 0
我有两个单选按钮和一个文本框，我需要在单击yes单选按钮时在文本框上显示(*)，并在没有单击单选按钮时将其删除。
我的观点是：
<label>code<sup id="star" disabled>*</sup></label>
>Add to electronic<input type="radio" name="yes" id="yes"/>onchange="starenable()"/><
浏览 0提问于2017-07-07得票数 0
我有一个html代码中的单选按钮：
<span><input type="radio" value="false" name="item[shipping]" id="item_shipping_false" checked="checked"><label for="item_shipping_false" class="collection_radio_buttons">No</label></span>
<sp
浏览 7提问于2012-05-08得票数 6
回答已采纳
我在单选按钮列表中使用了以下代码(一般有两个选项)。这使我可以放置另一个输入(文本框、另一个单选按钮列表等)。在<div>中隐藏，直到单击按钮。
<script type="text/javascript">
$(document).ready(function () {
$("input[name$='RadioButton1']").on ( "change", function() {
if (this.value == "Yes")
浏览 3提问于2016-12-04得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
