Закрыть раскрывающееся меню при нажатии за его пределамиJquery

Программирование на jquery
Ответить Пред. темаСлед. тема
Гость
 Закрыть раскрывающееся меню при нажатии за его пределами

Сообщение Гость »


У меня возникла проблема с раскрывающимся меню навигации на моем сайте, которую я почти решил, но не могу полностью исправить. Я боюсь, что, возможно, только что испортил свой код.

Когда я представил функцию «прокрутки до привязки тегов» с событием PreventDefault, это сломало мое навигационное меню. Меню не закроется, если вы еще раз не нажмете кнопку меню. Наконец-то мне удалось закрыть его после того, как вы нажмете одну из ссылок, но теперь это единственный способ закрыть его. Как сделать так, чтобы оно закрывалось при нажатии на кнопку меню или где-нибудь еще на сайте? Я уверен, что виновата эта часть jQuery, но не знаю, как это исправить или обойти.

HTML для меню:

Домой О программе Услуги Работа Отзывы Контакт Блог И соответствующий jQuery:

// Когда пользователь нажимает кнопку, переключается между скрытием и отображением содержимого раскрывающегося списка. функция myFunction() { document.getElementById("myDropdown").classList.toggle("показать"); } //// Закроем раскрывающееся меню, если пользователь щелкнет за его пределами window.onclick = функция (событие) { if (!event.target.matches('.dropbtn')) { dropdowns.forEach(function (openDropdown) { dropdown.classList.contains('показать') && dropdown.classList.remove('показать'); }); } }; ////Это раздел, который я сделал для того, чтобы он закрывался после нажатия на ссылку jQuery(документ).ready(функция ($) { $('.dropbtn').on('click', function () { $(".dropdown-content").show(); }); $('.navlink').on('click', function () { $(".dropdown-content").hide(); }); }); Это потенциальная проблема, которая портит другие функции.

//Прокрутка до привязки тегов $(document).on('click', 'a:not(.external)', function (event) { событие.preventDefault(); $('html, body').animate({ ScrollTop: $($.attr(this, 'href')).offset().top }, 500); }); var $root = $('html, body'); $('a').click(function () { $root.animate({ ScrollTop: $($.attr(this, 'href')).offset().top }, 500); вернуть ложь; }); Что мне следует сделать, чтобы исправить свое меню?

Вы можете просмотреть сайт незавершенной работы по адресу http://idpdx.kreigd.com

Обновление: думаю, у меня есть подсказка, где что-то запутывается. Функция, которую я использую для добавления раскрывающегося списка, требует, чтобы класс "show" добавлялся после щелчка по элементу .dropbtn и удалялся при повторном щелчке по нему.

Поэтому мне действительно нужно переработать код, чтобы нажатие на .dropbtn открывало раскрывающийся список, а нажатие на что-либо еще, включая кнопки навигации и элемент .dropbtn, закрывало его.

Обновление 2. Пробуем другой метод. Не обращайте внимания на это первое обновление.
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение
  • Закрыть раскрывающееся меню при нажатии за его пределами
    Anonymous » » в форуме Html
    0 Ответы
    10 Просмотры
    Последнее сообщение Anonymous
  • Закрыть раскрывающееся меню при нажатии за его пределами
    Anonymous » » в форуме Jquery
    0 Ответы
    19 Просмотры
    Последнее сообщение Anonymous
  • Открытое раскрывающееся меню не изменится, пока я не закрою раскрывающееся меню.
    Anonymous » » в форуме Android
    0 Ответы
    44 Просмотры
    Последнее сообщение Anonymous
  • Открытое раскрывающееся меню не изменится, пока я не закрою раскрывающееся меню.
    Anonymous » » в форуме Android
    0 Ответы
    36 Просмотры
    Последнее сообщение Anonymous
  • Как закрыть ранее открытое раскрывающееся меню в навигационном меню MudBlazor с помощью JavaScript?
    Anonymous » » в форуме C#
    0 Ответы
    25 Просмотры
    Последнее сообщение Anonymous

Вернуться в «Jquery»