时间戳

首页 > 解决方案 > 将类添加到父跨度元素jquery

javascript - 将类添加到父跨度元素jquery

问题描述

我正在尝试将复选框父元素（跨度）的类更改为选中。我正在按照这些步骤操作，但出现错误：

$checkbox.parentNode.addClass 不是 HTMLInputElement 中的函数。

这是网站

这是JS代码：

<script type="text/javascript">
        document.getElementById("generateVin").addEventListener("click", function(){

                var $checkbox = document.querySelectorAll("input[type='checkbox']")[1];
                var $span=$checkbox.closest("span");
                $checkbox.parentNode.addClass("checked");

});
        </script>

标签： javascriptjquery

解决方案

您正在将 jQuery 与香草 JavaScript 混合。.addClass()是一个jQuery方法，这意味着它只能在jQuery元素上调用。

$checkbox.parentNode不是jQuery 元素，而是标准的 JS 元素。

如果您致力于使用 jQuery，那么强烈建议您“一路走来”，而不是来回走动。代码看起来更像这样：

$("#generateVin").on("click", function() {
    var $checkbox = $("input[type=checkbox]").eq(1);
    var $span = $checkox.closest("span");    //This doesn't seem to be needed
    $checkbox.parent().addClass("checked");
});

  • 使用 jQuery 选择器语法来定位generateVin：$("#generateVin")

  • 使用的 jQuery 事件处理程序：.on("click", function() { ... })

  • $checkbox使用 jQuery 选择器和转换为 jQuery 元素.eq()：var $checkbox = $("input[type=checkbox]").eq(1);

  • 使用 jQueryparent()代替parentNode

推荐阅读