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

时间:2012-05-09 09:52:02

标签: javascript jquery jquery-ui

我有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);

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

5 个答案:

答案 0 :(得分:11)

您正在使用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")

Live DEMO

jQuery-UI source

答案 1 :(得分:7)

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

<强> DEMO

答案 2 :(得分:1)

再次禁用调用$(“#test”)。buttonset()后。

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

然后:

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

我测试它并为我工作

答案 3 :(得分:0)

根据jQuery docs,正确的方法是:

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

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

答案 4 :(得分:0)

我使用的方法是(无线电组ID是按钮集ID):

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

现在,假设您想将一个单选按钮设置为选中状态,触发您可能已将其编程到相关单选按钮的单击事件,然后禁用它,则可以按以下方式链接所有这些内容:

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