如何在 javascript 中的 if else 语句中检查 parentNode classList

Question

我有一个函数，每当从特定组中单击复选框时都会调用该函数。我试图在选中复选框时将 class 添加到输入的父包装器，然后在未选中时删除 class 。我的问题是，我似乎无法让 parentNode 和 classList 一起工作。

例如。此代码有效：

$(this.parentNode).css( "border", "3px solid red" );

但是这段代码returns一个未定义的错误

alert($(this.parentNode).classList

对于上下文，这是我最终要达到的目标：

    if ($(this.parentNode.parentNode).find('.form-type-checkbox').classList.contains("chkbox-checked")) {
      $(this.parentNode.parentNode).find('.form-type-checkbox').removeClass("chkbox-checked");
    } else {
      $(this.parentNode).addClass("chkbox-checked");
    }

Answer 1

$(this.parentNode) 是一个 jQuery 对象，因为 classList 是纯 JS 属性，这不适用于 jQuery 引用的对象。

尝试使用 jQuery 的 .attr():

$(this.parentNode).attr('class');

Answer 2

不要盲目使用jQuery。 this.parentNode.classList 将被定义，因为它没有包含在 jQuery 中，因为 classList 不存在于 jQuery.

中

Answer 3

我认为最简单的解决方案可能是您应该使用 jQuery 的 toogleClass()。请参考以下代码。

$("#id_of_radioButton").click(function(){
  $("#id_of_parentNode").toggleClass("classname");
});

如何在 javascript 中的 if else 语句中检查 parentNode classList

How to examine parentNode classList in an if else statement in javascript

javascript

parent-node