Question

我在表格中有一系列单选按钮，它位于bootstrap 4模态的主体中。我正在试图查看哪一个被检查，这应该是一件非常简单的事情，但我今天正在努力解决它并且不知道我做错了什么。

这是HTML。

<div class="card-body">
  <div class="custom-control custom-radio">
    <input type="radio" id="tdeeActivitySedentary" name="customRadioInline3" class="custom-control-input" value="1.2">
    <label class="custom-control-label" for="tdeeActivitySedentary">Sedentary (little or no exercise)</label>
  </div>
  <div class="custom-control custom-radio">
    <input type="radio" id="tdeeActivityLight" name="customRadioInline3" class="custom-control-input" value="1.375">
    <label class="custom-control-label" for="tdeeActivityLight">Light Activity (light exercise 1-3 days per week)</label>
  </div>
  <div class="custom-control custom-radio">
   <input type="radio" id="tdeeActivityMod" name="customRadioInline3" class="custom-control-input" value="1.55">
    <label class="custom-control-label" for="tdeeActivityMod">Moderately Activity (moderate exercise 3-5 days per week)</label>
  </div>
  <div class="custom-control custom-radio">
    <input type="radio" id="tdeeActivityHeavy" name="customRadioInline3" class="custom-control-input" value="1.725">
    <label class="custom-control-label" for="tdeeActivityHeavy">Very Active (hard exercise 5+ days per week)</label>
  </div>
  <div class="custom-control custom-radio">
    <input type="radio" id="tdeeActivityEx" name="customRadioInline3" class="custom-control-input" value="1.9">
    <label class="custom-control-label" for="tdeeActivityEx">Extremely Active (very hard exercise 6+ days per week)</label>
  </div>
</div>

我试过了：

for (var i = 0; i < 7; i++) {
  if ($("input[name='customRadioInline3']").is(':checked')) {
    alert("Checked")
  } 
}

和

if ($("input[name='customRadioInline3']").is(':checked')) {
  alert("Checked")
}

唯一可行的是，如果我把它放在一个按钮点击（但我不能这样做，因为我必须在执行提交按钮之前检查值）。

Answer 1

您可以按照以下方式检查按钮单击时选中的单选按钮的长度：

＆＃13;

$("#btnClick").click(function(){
  if($("input[name=customRadioInline3]:checked").length > 0){
    alert("Checked");
  }
  else{
    alert("Not checked");
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="card-body">
  <div class="custom-control custom-radio">
      <input type="radio" id="tdeeActivitySedentary" name="customRadioInline3" class="custom-control-input" value="1.2" >
      <label class="custom-control-label" for="tdeeActivitySedentary">Sedentary (little or no exercise)</label>
  </div>
  <div class="custom-control custom-radio">
      <input type="radio" id="tdeeActivityLight" name="customRadioInline3" class="custom-control-input" value="1.375">
      <label class="custom-control-label" for="tdeeActivityLight">Light Activity (light exercise 1-3 days per week)</label>
  </div>
  <div class="custom-control custom-radio">
      <input type="radio" id="tdeeActivityMod" name="customRadioInline3" class="custom-control-input" value="1.55">
      <label class="custom-control-label" for="tdeeActivityMod">Moderately Activity (moderate exercise 3-5 days per week)</label>
  </div>
  <div class="custom-control custom-radio">
      <input type="radio" id="tdeeActivityHeavy" name="customRadioInline3" class="custom-control-input" value="1.725">
      <label class="custom-control-label" for="tdeeActivityHeavy">Very Active (hard exercise 5+ days per week)</label>
  </div>
  <div class="custom-control custom-radio">
      <input type="radio" id="tdeeActivityEx" name="customRadioInline3" class="custom-control-input" value="1.9">
      <label class="custom-control-label" for="tdeeActivityEx">Extremely Active (very hard exercise 6+ days per week)</label>
  </div>
</div>
<input type="button" id="btnClick" value="Click"/>

＆＃13;

Answer 2

不确定要实现的目标，但$("input[name='customRadioInline3']")将返回数组中的所有输入，因此您必须迭代它们。

var radios=$("input[name='customRadioInline3']");
for(var i =0; i < radios.length; i++ ) {
    if(radios[i].checked) {
        alert("Checked");
    } 
}

如果您只想要选中的一个：

$("input[name='customRadioInline3']:checked")

使用val（）获取值：

$("input[name='customRadioInline3']:checked").val()

点击单选按钮jquery

2 个答案: