Question

我想要隐藏所有未选中的单选按钮及其标签，然后使用提交按钮单击事件仅显示选中的单选按钮。

<form method="post">
    <input type="radio" name="radiobtn">
    <label for="first">First</label>
    <input type="radio" name="radiobtn">
    <label for="second">Second</label>
    <input type="radio" name="radiobtn">
    <label for="third">Third</label><br>
    <input id="submit" type="submit">
</form>

我想使用jQuery来完成这项工作。任何人都可以给我一些关于如何做到这一点的jQuery代码？

Answer 1

做一些像这样简单的事情

$('#submit').click(function(e) {
  e.preventDefault(); // prevent the form submission
  $('[name="radiobtn"]:not(:checked)') // get all unchecked radio
    .hide() // hide them
    .next() // get all label next to them
    .hide(); // hide the labels
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form method="post">
  <input type="radio" name="radiobtn">
  <label for="first">First</label>
  <input type="radio" name="radiobtn">
  <label for="second">Second</label>
  <input type="radio" name="radiobtn">
  <label for="third">Third</label>
  <br>
  <input id="submit" type="submit">
</form>

jquery - 使用提交按钮隐藏未选中的单选按钮

1 个答案: