Question

    $('div').on('click', function (ev) {
    if (ev.target.tagName === 'SPAN') {
        if ($(ev.target).prev().is(':checked') === false) {
            $(ev.target).prev().attr('checked', true)
        }
        else {
            $(ev.target).prev().attr('checked', false)
        }
    }
});

所以，当我点击我的span元素时，取消选中的收音机会被检查，然后当我再次点击它时，它会被取消选中，但它会中断，这就是...这就是我的问题。当我点击它多次2次时，不会将选中的值更改为任何值。这是我的HTML

<div>
    <input type="text" placeholder="Answer...">
    <input type="radio" name="1"> <span>Answer 1</span>
    <input type="radio" name="1"> <span>Answer 2</span>
    <input type="radio" name="1"> <span>Answer 3</span>
    <input type="radio" name="1"> <span>Answer 4</span>
</div>

Answer 1

您想使用.prop代替.attr：

$('div').on('click', function(ev) {
  if (ev.target.tagName === 'SPAN') {
    if ($(ev.target).prev().is(':checked') === false) {
      $(ev.target).prev().prop('checked', true)
    } else {
      $(ev.target).prev().prop('checked', false)
    }
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <input type="text" placeholder="Answer...">
  <input type="radio" name="1"> <span>Answer 1</span>
  <input type="radio" name="1"> <span>Answer 2</span>
  <input type="radio" name="1"> <span>Answer 3</span>
  <input type="radio" name="1"> <span>Answer 4</span>
</div>

请参阅How to check a radio button with jQuery ?

Answer 2

嗯，这是一个简单的解决方案。不漂亮，但它完成了这项工作。只需记住要始终重置所有输入，因为它的名称相同的无线电，你不能再检查一个。

$('span').on('click', function (ev) {
    if (ev.target.tagName === 'SPAN') {
        if ($(ev.target).prev().is(':checked') === false) {
            $('input[type="radio"]').attr('checked', false);
            $(ev.target).prev().attr('checked', true);
        }
        else {  
            $(ev.target).prev().attr('checked', false);
        } 
    }
});

http://jsbin.com/wabecaboha/1/edit

在<span>单击更改收音机以选中或取消选中

2 个答案: