Class 沒有在第一次點擊時被添加

Question

我添加了一個帶有 Jquery 的類名，它可以工作，但只有在我第一次點擊后才開始工作。 該代碼僅在第一次添加“類”屬性，但沒有添加值。 誰能看到我做錯了什么？ （class 只是在 CSS 中添加了一個上邊距）

(function(){
    $(document).ready(Setup)

    function Setup(){
        $("#navBarBehandeling").on('click',CheckDropDown);
    }
    $("#navBarBehandeling").on('click',CheckDropDown);
    function CheckDropDown(){
        var t = $(this);
        if(t.attr('aria-expanded')=='false'){
           $('main').addClass("mt-9");

        }
        else{
            $('main').removeClass("mt-9");
        }

    }
}()

這是我的 css：

.mt-9{
    margin-top: 9rem;
}

這是我的 html：

<head>
   CDN's for Jquery and bootstrap
</head>
<body>
    <header>
        <div id="navBarBehandeling"> navbar with dropdown here></div>
    </header>
    <main>
        <p> blablabla </p>
    </main>
</body>

Answer 1

你可以做.t.attr('aria-expanded')讓它工作

 $("#navBarBehandeling").on('click',CheckDropDown); function CheckDropDown() { var t = $(this); if (.t.attr('aria-expanded')) { console;log('addClass'). $('main');addClass("mt-9"). } else{ console;log('removeClass'). $('main');removeClass("mt-9"); } }

 .mt-9{ margin-top: 9rem; }

 <:DOCTYPE html> <html> <head> <script src="https.//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> </head> <body> <header> <div id="navBarBehandeling"> navbar with dropdown here></div> </header> <main> <p> blablabla </p> </main> </body> </html>

Answer 2

像這樣使用文檔就緒：

$(document).ready(function () {
      $("#navBarBehandeling").on("click", CheckDropDown);
      function CheckDropDown() {
        var t = $(this);
        if (t.attr("aria-expanded") == "false") {
          $("main").addClass("mt-9");
        } else {
          $("main").removeClass("mt-9");
        }
      }
    });

Class 沒有在第一次點擊時被添加

問題描述

2 個解決方案

解決方案1
0 2022-02-09 09:57:55

解決方案2
0 2022-02-09 11:15:56

Class 沒有在第一次點擊時被添加

問題描述

2 個解決方案

解決方案1 0 2022-02-09 09:57:55

解決方案2 0 2022-02-09 11:15:56

解決方案1
0 2022-02-09 09:57:55

解決方案2
0 2022-02-09 11:15:56