jQuery -如何为包含与选中框相关的复选框的单个div添加类？
jQuery -如何为包含与选中框相关的复选框的单个div添加类？
提问于 2012-11-29 18:46:18
下面是HTML：
<ul>
<li>
<div class="checkbox-wrap">
<p>Check this:
<input type="checkbox" />
</p>
</div>
</li>
<li>
<div class="checkbox-wrap">
<p>Check this:
<input type="checkbox" />
</p>
</div>
</li>
<li>
<div class="checkbox-wrap">
<p>Check this:
<input type="checkbox" />
</p>
</div>
</li>
</ul>jQuery：
$this('input:checkbox').change(function(){
if($(this).is(":checked")) {
$('div.checkbox-wrap').addClass("active-checkbox");
} else {
$('div.checkbox-wrap').removeClass("active-checkbox");
}
});选中复选框时，类"active- checkbox“将被添加到整个3个div中。有没有办法在不使用ID或自定义类名的情况下为单个div而不是整个3个div添加类？
谢谢
回答 5
Stack Overflow用户
回答已采纳
发布于 2012-11-29 18:48:24
您错误地将$('input:checkbox')替换为$this('input:checkbox')，您可以使用closest()在祖先层次结构中查找选择器的第一个匹配项。
$('input:checkbox').change(function(){
if($(this).is(":checked")) {
$(this).closest('div.checkbox-wrap').addClass("active-checkbox");
} else {
$(this).closest('div.checkbox-wrap').removeClass("active-checkbox");
}
});Stack Overflow用户
发布于 2012-11-29 18:48:15
您需要使用closest查找最近的.checkbox-wrap元素：
$('input:checkbox').change(function() {
var $checkbox = $(this);
if ($checkbox.is(":checked")) {
$checkbox.closest('div.checkbox-wrap').addClass("active-checkbox");
} else {
$checkbox.closest('div.checkbox-wrap').removeClass("active-checkbox");
}
});有关的更多信息
另外，我假设开头的$this是jQuery的别名版本，而不是一个拼写错误？
Stack Overflow用户
发布于 2012-11-29 18:49:21
您可以使用nth-child选择器
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13624020
复制相关文章
相似问题
腾讯云开发者
