如果单击类，则执行此操作，否则执行此操作？

Question

我有一个打开下拉菜单的按钮。单击某个选项或关闭菜单后，下拉选项就会消失。我需要尝试建立太不同的功能，一个是如果单击菜单项，另一个是如果未单击菜单项（即屏幕的不同部分）。我尝试通过 - 如果类对象包含“.menubtns”执行此操作..否则....// Close the dropdown menu if the user clicks outside of itwindow.onclick = function(event) {  if (!event.target.matches('.dropbtn')) {    var dropdowns = document.getElementsByClassName("dropdown-content");    var i;    for (i = 0; i < dropdowns.length; i++) {      var openDropdown = dropdowns[i];      /// here is where the behaviour needs to be added //////////      if (openDropdown.classList.contains('show') &&        ($(this.target).hasClass('menubtns'))) {        openDropdown.classList.remove('show');        console.log('you have clicked an option');      } else {        console.log('not clicked on an option')        openDropdown.classList.remove('show');        mainpageaccessibility();      }    }  }这样我就可以在弹出模式中设置选项卡顺序。目前，它打开模式，但也运行“mainpageaccessibility();” 然后删除所有 taborders。任何帮助将不胜感激！

Answer 1

我无法测试这个，但看来你在应该使用“事件”的地方使用了“这个”

“this”指的是窗口对象。

// Close the dropdown menu if the user clicks outside of it

window.onclick = function(event) {

    if (!event.target.matches('.dropbtn')) {

        var dropdowns = document.getElementsByClassName("dropdown-content");

        var i;

        for (i = 0; i < dropdowns.length; i++) {

            var openDropdown = dropdowns[i];

            /// here is where the behaviour needs to be added //////////

            if (openDropdown.classList.contains('show') &&

                ($(event.target).hasClass('menubtns'))) {

                openDropdown.classList.remove('show');

                console.log('you have clicked an option');

            } else {

                console.log('not clicked on an option')

                openDropdown.classList.remove('show');

                mainpageaccessibility();

            }

        }

    }

}

Answer 2

我无法测试这个，但看来你在应该使用“事件”的地方使用了“这个”

“this”指的是窗口对象。

// Close the dropdown menu if the user clicks outside of it

window.onclick = function(event) {

    if (!event.target.matches('.dropbtn')) {

        var dropdowns = document.getElementsByClassName("dropdown-content");

        var i;

        for (i = 0; i < dropdowns.length; i++) {

            var openDropdown = dropdowns[i];

            /// here is where the behaviour needs to be added //////////

            if (openDropdown.classList.contains('show') &&

                ($(event.target).hasClass('menubtns'))) {

                openDropdown.classList.remove('show');

                console.log('you have clicked an option');

            } else {

                console.log('not clicked on an option')

                openDropdown.classList.remove('show');

                mainpageaccessibility();

            }

        }

    }

}