jquery next 不适用于下一个 div，无法添加类

Question

我在激活子类时遇到问题。

https://jsfiddle.net/d36k2L3c/2/

我正在构建一个复选框系统，不仅希望激活“复选框”，还希望更改子 div 的颜色。该代码根据需要更改复选框，但对子 div 不执行任何操作。

任何人都可以帮助我，非常感谢!谢谢，

<div class="question">
  <div class="question_check">
<div id="qid" class="question_check_box"></div>
   </div>
   <div class="question_content">This is the question</div>
</div>

 $(".question_check_box").on().click(function () {
$(this).toggleClass("question_check_box question_checked_box").next(".question_content").addClass("grey");

});
$(".question_checked_box").on().click(function () {
$(this).toggleClass("question_checked_box question_check_box").next(".question_content").removeClass("grey");
});

Answer 1

原因.next()单独是行不通的，因为question_check_box不是 question_content 的 sibling 。因此，您首先需要导航到 question_check_box 的父级(即 question_check )，然后使用 .next()功能。

 $(".question_check_box").on().click(function() {
   $(this).toggleClass("question_check_box question_checked_box").closest(".question_check").next(".question_content").addClass("grey");
 });

 $(".question_checked_box").on().click(function() {
   $(this).toggleClass("question_checked_box question_check_box").closest(".question_check").next(".question_content").removeClass("grey");
 });