为什么当我尝试通过添加类来使用 jQuery 隐藏我的 CSS 三角形时它不起作用

Why when I try to hide my CSS triangle with jQuery by adding a class does it not work?

本文关键字：我的 隐藏 jQuery CSS 三角形 不起作用 添加 为什么      更新时间：2023-09-26

我想隐藏我的CSS三角形，它使用:before附加到div，我遇到了这个解决方案来实现：https://stackoverflow.com/a/11354393/998117

但是，我的jQuery不起作用：

$(".contact input[type='submit']").click(function(event) {
    event.preventDefault();
    $(".contact .inner").addClass("hidden");
    ...

（是的，它确实被调用了。

这是我的 CSS/SASS 的样子：

.contact {
    background: #3c6ea5;
    color: #fff;
    display: none;
    height: 500px;
    .hidden:before {
            display: none;
        }
    .inner {
        margin: auto;
        padding-top: 20px;
        position: relative;
        width: 400px;
        &:before {
            border: solid;
            border-color: #3c6ea5 transparent;
            border-width: 14px 16px 0 16px;
            bottom: -107px;
            content: "";
            display: block;
            position: absolute;
            right: -50px;
        }
        .hidden:before {
            display: none;
        }
    }
    ...

为什么不隐藏它？我做错了什么？

你的Sass稍微关闭了一点点，应该是：

.inner {
    &.hidden:before {
        display: none;
    }
}

注意隐藏的 & 之前

尝试以下代码来解决您的问题：

.inner { &:before {     
     .hidden & { display:none;}}}
相关文章：