Javascript 即使找到父对象，父对象上的toggleClass（）仍不工作

您好，我在我的页面中重复了以下HTML（显然，每个实例中的名称、for和id属性都会发生变化）：

现在这一切都很好，但在测试过程中我注意到，如果单击标签文本，则不会应用该类，并且不会切换输入值。。。因此，我添加了以下内容

$(".funkyCheckBox label").live("click, tap", function(event){                  
    $(this).parent("div").toggleClass("funkyCheckBoxActive");
    var nextCheckBox = $(this).next("input[type=checkbox]");
    nextCheckBox.prop("checked", !nextCheckBox.prop("checked"));
}); 

现在这很好，因为单击标签文本现在会更改输入的值，但是父DIV不会接受/切换“funkyCheckBoxActive”类。我不确定为什么在回调函数中使用了

console.log（$（this.parent（“div”））

，并且我正在输出dom对象的属性。有人知道为什么我的

toggleClass

没有被应用吗？

请使用“on”方法，而不是“live”，因为它已被弃用。标签标记中的“for”属性也指向现有Id

以下是更正后的工作代码：

<div class="funkyCheckBox">
    <label for="uniqueName"> Whatever Text </label>
    <input type="checkbox"  name="uniqueName" id="uniqueName" />
</div>

​

编辑：这里是JSFIDLE链接

EDIT2:@Mike Sav:我已经修改了你的代码，现在它可以处理所有可能的情况：

---

取决于jQuery的版本，您的代码是否有效。 请注意，当您单击引用该复选框的标签时，浏览器已在切换该复选框；因此，您只需执行以下操作：

$('#uniqueName').change(function() {
    $(this).parents("div").toggleClass("funkyCheckBoxActive");
});

---

你能不能把它恢复到原来的样子，添加标签->单击带有

$（this.parent（“div”）。在里面单击（）

？如果我尝试复选框没有响应？？？你为什么认为类没有被更改？很可能是这样。若问题是你们并没有看到视觉上的CSS变化，那个么很可能是CSS的特殊性问题。在

toggleClass

之后，尝试

console.log（$（this）.closest（'.funkyCheckBoxActive'）.length）

1。称别人为白痴不会让你在社区里走得更远。2.您的代码不起作用，添加该类，您将在单击复选框时看到它没有被应用，使用FireBug，您将在DIV（希望）EDIT上看到切换的类：我已经更新了JSFIDLE，以防您不知道FireBug是什么：

<div class="funkyCheckBox">
    <label for="uniqueName"> Whatever Text </label>
    <input type="checkbox"  name="uniqueName" id="uniqueName" />
</div>

$(".funkyCheckBox label").click(function(event){
     $(this).parent("div").toggleClass("funkyCheckBoxActive");

     var nextCheckBox = $(this).next("input[type=checkbox]");
     var nextCheckBoxValue = nextCheckBox.val();

     nextCheckBox.val(! nextCheckBoxValue);
}); ​

$('#uniqueName').change(function() {
    $(this).parents("div").toggleClass("funkyCheckBoxActive");
});