Javascript 如何在输入的下一个跨距上添加活动类（type="；radio"；和checked="；checked"；）？

我想在输入收音机旁边的span中添加一个活动类，该类已检查状态，我们在一个页面中有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>

你可以用

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

要访问选中收音机旁边的

。

请在jquery中使用

$(".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);

$（“#.ms下拉列表”）。每个（函数（）{

}))

试试这个

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

$（“.ms下拉列表”）.each（函数（）{

---

}))

你能不能创建一个“普通”人使用CSS:

.singleselect:checked~span{/*activestyles here*/}

你好，巴拉谢谢你的回复，它没有完全满足我的要求，我已经准备好尝试这个了，它的工作已经过去了one@Jainandansinghbaghel你需要什么？我要每签一页，正如我所描述的，一个页面中有15个东西，所以它只适用于最后一个one@Jainandansinghbaghel我现在更新了帖子。我想这可能会对你们有所帮助。但我不能清楚地理解你们的要求。。请参阅演示文稿，了解这与OP的代码有什么不同，以及为什么OP的代码不起作用，这对OP和后面的人都很有用。

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

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

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