#jquery #toggle
#jquery #переключение
Вопрос:
У меня есть простой переключатель открытия закрытия, поиграйте здесь и подумайте, можно ли его закрыть, просто щелкнув где-нибудь еще на сайте (а также его текущую кнопку) (не обязательно другую ссылку) пробел, где угодно и т.д..
$(document).ready(function() {
$('a.show_hide').click(function() {
$('.hidden-menu').toggle();
$(this).toggleClass('close');
});
});
Ответ №1:
это то, что вам нужно: http://jsfiddle.net/5jzUD/9 /
$(document).ready(function() {
$(document).on('click',function(clickPosition){
if (!$('.hidden-menu, a.show_hide').is(clickPosition.target) amp;amp; $('.hidden-menu').has(clickPosition.target).length === 0){
$('.hidden-menu').hide();
$('a.show_hide').addClass('close');
}
else{
if($('a.show_hide').is(clickPosition.target) amp;amp; $('.hidden-menu').css('display')!='none'){
$('.hidden-menu').hide();
$('a.show_hide').addClass('close');
return;
}
$('.hidden-menu').show();
$('a.show_hide').removeClass('close');
}
});
});
Комментарии:
1. Спасибо вам, ребята, за вашу помощь, отлично. 🙂
Ответ №2:
Обновленная скрипка
- Используется
$(document).click()
для привязки или захвата события щелчка — в любом другом месте сайта. - Использовать
event.stopPropagation()
в исходномa
событии щелчка. Это остановит всплывающее окно событий. - И не используйте
.toggle()
в$(document).click()
функции, поскольку это такжеshow()
было бы элементом.
Проверьте этот фрагмент.
$(document).ready(function () {
$('a.show_hide').click(function (event) {
event.stopPropagation();
$('.hidden-menu').toggle();
$(this).toggleClass('close');
});
$(document).click(function (e) {
$('.hidden-menu').hide();
$('a.show_hide').removeClass('close');
});
});
Вместо $(document)
этого вы также можете использовать : $('*:not(a.show_hide)')
: Demo
Комментарии:
1. этот код скрывает меню, даже если вы нажмете на него, так что это не то, чего хочет OP!
2. Я прочитал это, задаваясь вопросом, можно ли его закрыть, просто щелкнув где-нибудь еще на сайте