是否选中了所有单选按钮?

时间:2019-10-25 21:39:54

标签: javascript jquery html jquery-ui

我的jQuery代码和单选按钮有问题, 如果我选择了一个按钮,而他又选择了另一个按钮,那么如果有人可以帮助我解决我的问题,我不知道该如何解决,谢谢。我留下我的代码并进行屏幕截图以查看实际情况。

enter image description here

$("#custom").click(function() {
  $(".custom").css({
    "display": "block"
  })
})

$("#man").click(function() {
  $(".custom").css({
    "display": "none"
  })
})

$("#ladies").click(function() {
  $(".custom").css({
    "display": "none"
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" id="ladies" name="ladies" value="ladies">
<label for="ladies">Ladies</label>

<input type="radio" id="man" name="man" value="man">
<label for="man">Man</label>

<input type="radio" id="custom" name="custom" value="custom">
<label for="custom">Custom</label>
<a href="#" class="icons"><i class="fas fa-question-circle fa-1x"></i></a>

<div class="custom">

  <form action="#">
    <select name='gender' id='gender'>
      <option value='gender' disabled>Select the pronoun you are using</option>
      <option value='she'>She: "Wihs her a happy brithday"</option>
      <option value='he'>He: "Wish him a happy birthday!"</option>
      <option value='he/she'>He / She: "Wish him / her a happy birthday!"</option>
    </select>
    <p class="genderTxt">The chosen pronoun is visible to everyone.</p>
    <input type="text" class="optionalG" placeholder="Gender (optional)">
  </form>
</div>

我没有任何错误消息要显示。

2 个答案:

答案 0 :(得分:2)

所有<input type="radio">标签都需要相同的name属性。然后它将起作用。

<input type="radio" id="ladies" name="gender" value="ladies" checked>
<label for="ladies">Ladies</label>

<input type="radio" id="man" name="gender" value="man">
<label for="man">Man</label>

<input type="radio" id="custom" name="gender" value="custom">
<label for="custom">Custom</label>

答案 1 :(得分:1)

单选按钮组上的name属性必须具有相同的名称。

更改此:

name 'PostponedBehaviour' is not defined

对此

 <input type="radio" id="ladies" name="ladies" value="ladies">
 <label for="ladies">Ladies</label>

 <input type="radio" id="man" name="man" value="man">
 <label for="man">Man</label>

 <input type="radio" id="custom" name="custom" value="custom">
 <label for="custom">Custom</label>

名称不必为“ radioGroup”,但名称必须相同,以便代码可以分辨出哪些单选按钮组属于同一组。