javascript - 设置为 buttonset() 后禁用单选按钮

Question

我有 3 个单选按钮

<div id="test">
<input type="radio" id="time1" name="radio" value="1" /><label for="time1">Test 1</label>
<input type="radio" id="time2" name="radio" value="2" /><label for="time2">Test 2</label>
<input type="radio" id="time3" name="radio" value="3" /><label for="time3">Test 3</label>
</div>

在jQuery中

$("#test").buttonset();

之后，我想禁用它们（当然，禁用放在if语句中）

$("#test input").attr("disabled", true);  //or
$("#test input").prop("disabled", true);

但它不起作用，按钮仍然启用。

Answer 1

您正在使用 jQuery-UI，将单选按钮更改为 后buttonset，它们不再影响 UserInterface，因为它包含：

<div id="test" class="ui-buttonset">
<input type="radio" id="time1" name="radio" value="1" class="ui-helper-hidden-accessible"><label for="time1" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false"><span class="ui-button-text">Test 1</span></label>
<input type="radio" id="time2" name="radio" value="2" class="ui-helper-hidden-accessible"><label for="time2" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Test 2</span></label>
<input type="radio" id="time3" name="radio" value="3" class="ui-helper-hidden-accessible"><label for="time3" aria-pressed="true" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right ui-state-active" role="button" aria-disabled="false"><span class="ui-button-text">Test 3</span></label>
</div>

所以你需要 jQuery UI 函数来禁用“按钮”（这是spans！）

$("#test input").button("disable")

现场演示

jQuery-UI 源码

Answer 2

$("#test > input:radio").button({disabled:true});

演示

Answer 3

再次禁用调用 $("#test").buttonset() 后。

$("#test").buttonset();

然后：

$("#test input").attr("disabled", true);  //or
$("#test input").prop("disabled", true);
$("#test").buttonset();

我测试它并为我工作

Answer 4

根据jQuery 文档，正确的做法是：

$( '#test' ).buttonset( 'option', 'disabled', true ).buttonset( 'refresh' );

我无法得到任何其他建议。这个对我来说。

Answer 5

我使用的方法是（无线电组 ID 是按钮集 ID）：

$('#RadioGroupID').buttonset('disable').buttonset('refresh');

现在，假设您想将其中一个单选按钮设置为被选中，触发您可能已编程到相关单选按钮的单击事件然后禁用，您可以将所有这些链接如下：

$('#RadioButtonID').prop('checked',true).trigger('click').parent().buttonset('disable').buttonset('refresh');