Почему приведенный код некорректно работает в SAFARI и FIREFOX?

Question

[Андрей Борчик]

function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display === "none") {
    function closeModalOnClickOutside(){
      if (!event.target.closest('#myDIV') && !event.target.closest('#myLink') && document.getElementById("myDIV").style.display !== "none") {
        console.log('close');
        window.removeEventListener('mousedown', closeModalOnClickOutside);
        document.getElementById("myDIV").style.display = "none";
      }
    }
    window.addEventListener('mousedown', closeModalOnClickOutside);
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

Данный код обрабатывает показ меню по клике на элемент.
При повторном клике меню исчезает.
Также исчезает при клике в сторону фоновую.

В Сафари и Файерфоксе не срабатывает скрытие меню при клике в фоне. В Хроме работает корректно.

Для примера - сайт Arthata.by - клик на элемент Цены вверху экрана.

Answer 1

[kreoTech]

А ничего что вы используете event не понятно откуда взявшийся в функции closeModalOnClickOutside

Его надо внести в параметры функции

Comments

[Андрей Борчик]

А как это реализоват? Я не силен в js

[kreoTech]

function closeModalOnClickOutside(event){
      if (!event.target.closest('#myDIV') && !event.target.closest('#myLink') && document.getElementById("myDIV").style.display !== "none") {
        console.log('close');
        window.removeEventListener('mousedown', closeModalOnClickOutside);
        document.getElementById("myDIV").style.display = "none";
      }
    }

[kreoTech]

Андрей Борчик, заменить функцию выше приведенной. Должно помочь

[Андрей Борчик]

kreoTech, спасибо. Помогло!