Question

所以，我在CMS中工作，我有自定义代码来选择从计算年龄派生的资金水平。此代码适用于多种形式，并且可以正常工作，除非我无法控制货币级别的值或ID。层次结构在表单与表单之间保持不变，捐赠级别标签容器也是如此，但每次重复迭代时，id和值都会更改为新的5位数字。

<div class="donation-levels">
  <div class="donation-level-container">
    <div class="form-content">
      <div class="donation-level-input-container form-input">
        <div class="donation-level-label-input-container">
          <input type="radio" name="level_installmentexpanded" id="level_installmentexpanded16025"
value="16025"/>
        </div>
        <label for="level_installmentexpanded16025" onclick="">
        <div class="donation-level-amount-container"> $250.00 </div>
        <div class="donation-level-label-container"> Age 40 and under </div>
        </label>
      </div>
      <input type="hidden" name="level_installmentexpandedsubmit" id="level_installment_16025expandedsubmit" value="true" />
    </div>
  </div>
  <div class="donation-level-container">
    <div class="form-content">
      <div class="donation-level-input-container form-input">
        <div class="donation-level-label-input-container">
          <input type="radio" name="level_installmentexpanded" id="level_installmentexpanded16022"
value="16022"/>
        </div>
        <label for="level_installmentexpanded16022" onclick="">
        <div class="donation-level-amount-container"> $230.00 </div>
        <div class="donation-level-label-container"> Age 41-60 </div>
        </label>
      </div>
      <input type="hidden" name="level_installmentexpandedsubmit" id="level_installment_16022expandedsubmit" value="true" />
    </div>
  </div>
  <div class="donation-level-container">
    <div class="form-content">
      <div class="donation-level-input-container form-input">
        <div class="donation-level-label-input-container">
          <input type="radio" name="level_installmentexpanded" id="level_installmentexpanded16021"
value="16021"/>
        </div>
        <label for="level_installmentexpanded16021" onclick="">
        <div class="donation-level-amount-container"> $180.00 </div>
        <div class="donation-level-label-container"> Age 61-70 </div>
        </label>
      </div>
      <input type="hidden" name="level_installmentexpandedsubmit" id="level_installment_16021expandedsubmit" value="true" />
    </div>
  </div>
  <div class="donation-level-container">
    <div class="form-content">
      <div class="donation-level-input-container form-input">
        <div class="donation-level-label-input-container">
          <input type="radio" name="level_installmentexpanded" id="level_installmentexpanded16026"
value="16026"/>
        </div>
        <label for="level_installmentexpanded16026" onclick="">
        <div class="donation-level-amount-container"> $140.00 </div>
        <div class="donation-level-label-container"> Age 71-79 </div>
        </label>
      </div>
      <input type="hidden" name="level_installmentexpandedsubmit" id="level_installment_16026expandedsubmit" value="true" />
    </div>
  </div>
</div>
</div>

使用相对选择器或其他伏都教，我可以设置一种动态选择它们的方法，而不必在每次应用于新表单时更改ID吗？

Answer 1

下面的代码可以帮助您，

$('.donation-level-label-input-container input[type="radio"]').each(function(){
    console.log($(this));
});

或者只是喜欢，

$('input[type="radio"]').each(function(){
    console.log($(this));
});

Answer 2

按名称或值选择：

 $("input[name=" + rbtname + "][value=" + yourVal + "]").attr('checked', 'checked');

Answer 3

您可以通过以下方式获取所有电台：

$('input[type="radio"]')

或按名称

 $('input[name="level_installmentexpanded"]')

得到检查：

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

Answer 4

您可以按类$（'。class_name'），按标签$（'tag_name'），按属性名称$（'[attribute]'）按属性值$（'[[attr =“”]'进行选择）和它们的组合。只需查看jQuery docs。

Answer 5

您可以找到单选按钮：

对于已检查的电台：

// Direct access
jQuery(':radio:checked')

// or by targeting a parent
jQuery('#a_form').find(':radio:checked');
// or
jQuery('#a_form').find(':radio').each(function(){
  if($(this).is(':checked')) {
   // Do for checked
  } else {
   // other else
  }
})

// or directly find unchecked radio
jQuery(':radio:not(:checked)').each(function(){
  var t = $(this);
})

Answer 6

好吧，大多数人都忽略了我的问题的先决条件。最终对我有用的是如下。

由于我正在使用jQuery，我使用:nth-child CSS选择器分别选择这些，因为它是通过jQuery，它适用于浏览器。我确实喜欢检查第二个输入：

     $j("div.donation-levels div:nth-child(2) div div input").prop('checked',true);

我注意到我似乎离开了一个div（虽然通过后代选择它仍然可以工作）因为它实际上不适用于我的第一个，我使用过：

     $j("div.donation-levels div:first-child div div div input").prop('checked',true);

使用更具体的层次结构和:first-child选择器。

如何在不使用其ID或值的情况下使用jQuery选择单选按钮？

6 个答案: