Question

我想在输入收音机旁边的范围中添加一个活动类，它已经检查了状态，我们在apage中有15个相同的div。

给出代码：

<div id="age_restric1" class="singleselect">
    <label for="age_restriction" class="required">Age Restriction <span class="required">*</span></label>
    <div class="ms-parent">
      <button class="ms-choice" type="button" style="width: 58px;"><span class=""> 18+</span>
      <div class=""></div>
      </button>
      <div class="ms-drop top" style="width: 58px; display: none;">
         <ul style="max-height: 250px;">
            <li>
               <label>
                  <input type="radio" value="" name="selectItem">
                  <span>None</span></label>
            </li>
            <li>
               <label>
                  <input type="radio" checked="checked" value="18+" name="selectItem">
                  <span>18+</span></label>
            </li>
            <li>
               <label>
                  <input type="radio" value="19+" name="selectItem">
                  <span>19+</span></label>
            </li>
         </ul>
      </div>
    </div>
    </div>
    <div class="singleselect">
    <label class="required" for="appropriate_atti">Appropriate Attire <span class="required">*</span></label>
    <div class="ms-parent">
      <button class="ms-choice" type="button" style="width: 130px;"><span class=""> Casual</span>
      <div></div>
      </button>
      <div class="ms-drop bottom" style="width: 130px;">
         <ul style="max-height: 250px;">
            <li>
               <label>
                  <input type="radio" value="" name="selectItem">
                  <span>--Select Attire--</span></label>
            </li>
            <li>
               <label>
                  <input type="radio" value="339" name="selectItem">
                  <span>Business Casual</span></label>
            </li>
            <li>
               <label>
                  <input type="radio" checked="checked" value="338" name="selectItem">
                  <span>Casual</span></label>
            </li>
         </ul>
      </div>
    </div>
    </div>

Javascript：

 setTimeout(customdrop, 200);
         function customdrop(){
                    $(".singleselect :checked").each(function(){
                    $(this).next('span').addClass('active');
                    });


             }

Answer 1

您可以使用

$('.singleselect input[type="radio"]:checked+span')

访问已检查无线电旁边的<span>。

Answer 2

在jquery中使用 attribute selector

$(".singleselect [type=radio]:checked").each(function () {
     $(this).next('span').addClass('active');
 });

 function customdrop() {
     $(".active").removeClass('active');
     $(this).next('span').addClass('active');
 }
 $(".singleselect [type=radio]").on("change", customdrop);

UPDATED DEMO

Answer 3

$（＆＃34;＃。ms-drop bottom li＆＃34;）。each（function（）{

if($('input').is(':checked')) { 
    $(this).closest('li').find('span').addClass('active');
}

}）;

Answer 4

试试这个

 jQuery("input[name=selectItem]").each(function(){
            if(jQuery(this).is(':checked')){
            jQuery(this).next('span').addClass('active');
            }
        })

Answer 5

$（“。ms-drop bottom li”）。each（function（）{

if($('input[type=radio]').is(':checked')) { 
    $(this).closest('li').find('span').addClass('active');
}

}）;

如何在输入的下一个范围上添加活动类（type =“radio”和checked =“checked”）？

5 个答案:

UPDATED DEMO