Question

我有一个显示和隐藏div的代码，当div打开或关闭时，不透明度和颜色会发生变化。而不是使用JQuery .css（）直接向元素添加CSS，我想使用addClass，但我无法弄清楚为什么下面的代码不起作用。

运行构建时，我收到消息'ReferenceError：$ is not defined'。我也不确定这意味着什么。请帮助。

JQuery的

$(document).ready(function() {
    $(".upload-panel-container").click(function(e) {
        $(".upload-menu-container").toggleClass("open").slideToggle(100, "linear");
        if ($(".upload-menu-container").hasClass("open")) {
            $(".upload-panel-container").addClass("setOpacityto1");
        } else {
            $(".upload-panel-container").addClass("setOpacityto85");
        }
    });

});

CSS

.setopacityto1 {
    opacity: 1;
    color: red;
}

.setopacityto85{
    opacity: .85;
    color: blue;
}

Answer 1

＆＃34; $未定义＆＃34;通常意味着jQuery没有正确加载到您的页面。所以$（jQuery语法）无法识别

更新：我修复了它。您的类名区分大小写，请确保在CSS和JS中使用相同的名称。您不仅需要在需要更改的位置添加类，还需要删除它们;否则，每次单击时，将再次添加该类，最后将添加到该元素的两个类。（检查元素，看看我的意思。）

$(document).ready(function() {
    $(".upload-panel-container").click(function() {
        $(".upload-menu-container").toggleClass("open").slideToggle(100, "linear");
        if ($(".upload-menu-container").hasClass("open")) {
            $(".upload-panel-container").addClass("setopacityto1");
            $(".upload-panel-container").removeClass("setopacityto85");
        } else {
            $(".upload-panel-container").addClass("setopacityto85");
            $(".upload-panel-container").removeClass("setopacityto1");
        }
    });

});

JQuery addClass无效

1 个答案: