Почему Uncaught ReferenceError: dropdown is not defined at HTMLLIElement.onclick?

Question

[Speakermen]

Не могу понять почему в анонимную функцию не попадает event?



<li class="rounded" onclick="App.create(event)">

const App = (() => {
  document.getElementById("switch-thema").addEventListener("change", () => {
    const thema = document.getElementById("thema");
    if (
      thema.className == "w-64 h-screen bg-white rounded relative theme-white"
    ) {
      thema.className = "w-64 h-screen bg-black rounded relative theme-black";
    } else if (
      thema.className == "w-64 h-screen bg-black rounded relative theme-black"
    ) {
      thema.className = "w-64 h-screen bg-white rounded relative theme-white";
    }
  });

  document.getElementById("toggle").addEventListener("click", () => {
    const noactive = document.getElementById("noactive");

    if (noactive.className == "flex flex-row gap-6 toggle-noactive") {
      noactive.className = "flex flex-row gap-6 toggle-active";
      console.log((toggle.lastElementChild.className = "uil uil-angle-right"));
    } else if (noactive.className == "flex flex-row gap-6 toggle-active") {
      noactive.className = "flex flex-row gap-6 toggle-noactive";
      console.log((toggle.lastElementChild.className = "uil uil-angle-left"));
    }
  });

  return {
    create: function dropdown(event) {
      if (event.target.parentElement.className == "dropdown rounded") {
        event.target.parentElement.className = "rounded";
        event.target.parentElement.firstElementChild.className =
          "uil uil-angle-right -mx-2 pl-3";
        event.target.nextElementSibling.className =
          "dropdown-menu bg-color hidden";
      } else if (
        event.target.parentElement.className == "rounded" &&
        event.target.localName == "a"
      ) {
        event.target.parentElement.className = "dropdown rounded";
        event.target.parentElement.firstElementChild.className =
          "uil uil-angle-down -mx-2 pl-3";
        event.target.nextElementSibling.className = "dropdown-menu bg-color";
      }
    },
  };
})();

Answer 1

[Сергей delphinpro]

Причем здесь передача event?
В ошибке прямым текстом написано: Я не знаю ни про какую функцию dropdown
Если хотите использовать ее в html, то функцию следует объявлять в глобальном контексте.
Например так

window.dropdown = function(event) {
}

Comments

[Speakermen]

Интересно как эта штука работает в статье, а у меня нет( Паттерны проектирования в JavaScript

const myModule = (function() {
  
  const privateVariable = 'Hello World';
  
  function privateMethod() {
    console.log(privateVariable);
  }
  return {
    publicMethod: function() {
      privateMethod();
    }
  }
})();
myModule.publicMethod();

[Сергей delphinpro]

Speakermen, вы в одном месте пишете
<li class="rounded" onclick="dropdown(event)">
в другом
<li class="rounded" onclick="App.create(event)">
Второе должно работать, если App находится в глобальном контексте

[Speakermen]

Сергей delphinpro, спасибо огромное Вам заработало ну это всё равно спагетти код(