Question

我试图让所选的单选按钮隐藏所有未选中的单选按钮？我想的方法是首先选择radiobutton并取消选择其他每个按钮的ID。但除此之外还有其他方法吗？（我认为获取每个id并取消选择有点麻烦）

这是我的HTML

<form>
      <group class="inline-radio">
        <div>
          <input id="opt1" type="radio" name="title">
          <label>opt1</label>
        </div>
        <div>
          <input id="opt2" type="radio" name="title" checked>
          <label>opt2</label>
        </div>
        <div>
          <input id="opt3" type="radio" name="title">
          <label>opt3</label>
        </div>
        <div>
          <input id="opt4" type="radio" name="title">
          <label>opt4</label>
        </div>
        <div>
          <input id="opt5" type="radio" name="title">
          <label>others</label>
        </div>
      </group>

</form>

该项目位于codepen http://codepen.io/flyingboy007/pen/ojoVWe

Answer 1

尝试：

$('input ').on('click',function(){
    $('input').not($(this)).hide();
});

单击选择除所选输入之外的所有输入并隐藏tham

Answer 2

您可以使用以下方式隐藏未选择的无线电： -

$('input[type="radio"]').not(':checked').hide();

您可以使用

隐藏未选中的无线电标签

$('input[type="radio"]').not(':checked').siblings('label').hide();

虽然你应该在标签上使用for。

修改

要更具体地针对该群组，请使用： -

$('group.inline-radio').find('input[type="radio"]').not(':checked').hide(); $('group.inline-radio').find('input[type="radio"]').not(':checked').siblings('label').hide();

或链接收音机和标签

$('group.inline-radio').find('input[type="radio"]').not(':checked').hide().siblings('label').hide();

显示所选的单选按钮并隐藏所有其他按钮

2 个答案: