jquery - 标记收音机检查，即使它被禁用

Question

我正在尝试将单选按钮标记为已选中click()，但如果禁用了单选按钮，这将不起作用。

我该怎么办？

Answer 1

您想使用该.prop()方法。.attr()难以检测跨浏览器真实性

$('input:radio:disabled').prop('checked', true);

^这将自动检查任何禁用的。

如果您希望它出现在某种点击事件等...您会这样做：

$('input:radio').prop('checked', true);

jsFiddle 演示

Answer 2

唯一的解决方案来自 javascript/jquery -（最简单的 jquery 示例）

<input type="radio" id="test" name="test_name" disabled="disabled" />

$(document).ready(function() {
  $('#test').attr('checked', 'checked');      
});​

看到这个 jsFiddle http://jsfiddle.net/7XevT/1/

Answer 3

唯一可以做到这一点的方法是在单选按钮前面放置一个元素（例如 div）并检查是否有点击。

鼠标事件在禁用元素上被禁用（有充分的理由......你已经禁用它！）

但是，可能有更好的方法来做你想做的事。我无法想象有人点击禁用的单选按钮。另外，如果您希望单选按钮可点击，请不要禁用它！

Answer 4

clickevent* 是错误的使用方法。click禁用的元素不会对被单击做出反应（因为它们已被禁用），因此触发事件没有好处。

<input type="radio" />并且<input type="checkbox" />元素具有checked需要修改以更改其选中状态的属性：

使用普通的 JS：

<input id="r" type="radio" name="foo" value="bar" disabled />
<script type="text/javascript">
    document.getElementById('r').checked = true;
</script>

使用 jQuery：

<input id="r" type="radio" name="foo" value="bar" disabled />
<script type="text/javascript">
    $('#r').prop('checked', true);
</script>

_{* 或函数，无法分辨您使用的是哪个。我认为它是jQuery.fn.click，它触发了一个事件。}

Answer 5

disabled输入不会触发点击事件。一种骇人听闻的方法是用另一个元素包装收音机：

<span class='radio'><input type='radio' disabled/></span>

$('.radio').click(function(){
  var $input = $(this).find('input'); 
  $input.prop('checked', !$input.prop('checked'))
})

演示

但我不确定为什么输入应该是disabled检查状态时可以更改！

Answer 6

游戏有点晚了，但你可以添加一个<span>可以放在单选按钮上的温度，这将产生你点击它的效果：

$('input[disabled="disabled"]').each(function(){
    $(this).wrap('<span style="position:relative;"></span>')
        $(this).parent().append('<span class="disabled" style="left:0; top:0; position:absolute; display:block; width:100%; height:100%;">&nbsp;</span>');
})

$('.disabled').click(function(){
    $(this).prev().removeAttr('disabled').attr('checked', 'checked').attr('disabled', 'disabled').unwrap();
    $(this).remove();
})

查看小提琴 - http://jsfiddle.net/FTymF/

您还可以切换禁用的单选按钮：

$('.disabled').click(function(){
    if($(this).prev().attr('checked'))
        $(this).prev().removeAttr('disabled').removeAttr('checked').attr('disabled', 'disabled');
    else
         $(this).prev().removeAttr('disabled').attr('checked','checked').attr('disabled', 'disabled');
})

查看小提琴 - http://jsfiddle.net/FTymF/1/