Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
 
Рейтинг 5.00/5: Рейтинг темы: голосов - 5, средняя оценка - 5.00
mihon1
0 / 0 / 2
Регистрация: 02.09.2013
Сообщений: 237
1

Появление элемента по клику на кнопку и скрытие элемента по клику на любое место body

12.09.2015, 16:22. Просмотров 977. Ответов 1
Метки нет (Все метки)

Задача стоит такая. Нужно сделать так, чтобы по клику на button class="helper" наш div id = "helper_list" появлялся на экране(по умолчанию он display:none), и после этого по клику на 'document' div id = "helper_list" исчезал.
Вот что делаю я.
HTML5
1
2
3
4
5
<body>
<div id = "helper_list">
</div>
<button type="button" class="helper"></button>
</body>
Javascript
1
2
3
4
5
6
7
8
$(document).ready(function(){
    $('.helper').on('click', function(){
        $('#helper_list').css('display' , 'block');
    });
    $(document).on('click', function(){
        $('#helper_list').css('display' , 'none');
    });
});
Проблема.
Проблема состоит вот в чем когда я кликаю на '.helper' наш div id = "helper_list" ДЕЙСТВИТЕЛЬНО становится display:block, НО из-за того что на элемент 'document' ТАКЖЕ поставлено событие click по которому происходит уже СКРЫТИЕ элемента у нас как бы мгновенно и сразу происходит и открытие элемента и его скрытие. А нам нужно чтобы было так -> сначала мы нажали на '.helper' произошло открытие div id = "helper_list" -> мы на него посмотрели -> кликнули на элемент 'document' и произошло скрытие div id = "helper_list". Вот это то мне сделать и не удается. Подскажите как можно решить эту проблему, буду рад любым подсказкам и предложениям. Заранее спасибо!
0
QA
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
12.09.2015, 16:22
Ответы с готовыми решениями:

Скрытие и появление дива по клику
Подскажите, что не так. Когда нажимаю на ссылку, то див раскрывается. Когда нажимаю снова на...

Функция по клику в любое место
Здравствуйте Есть кодик &lt;script type=&quot;text/javascript&quot;&gt; function switchDisplay(id) { var...

Узнать по клику тип элемента
Здравствуйте, Как можно по клику узнать тип элемента? именно DIV или SPAN - но изначально эти...

Смена класса элемента по клику
Имеется несколько классов R14, R14_2, R14_3.... Есть форма Application windows, на ней Jpanel и...

Обновление(перезагрузка) элемента по клику
$('#krestik').click(function () { $('#player').hide(1000); Добрый день. Подскажите...

1
Lazy_Den
3119 / 2738 / 1379
Регистрация: 15.01.2014
Сообщений: 6,032
12.09.2015, 17:18 2
Javascript
1
2
3
4
$('.helper').on('click', function(e){
    e.stopPropagation();
    $('#helper_list').css('display' , 'block');
});
Добавлено через 8 минут
P.S. Кстати, показать/скрыть можно более коротким способом:
Javascript
1
2
$('#helper_list').hide(); // скрыть 
$('#helper_list').show(); // показать
1
Answers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
12.09.2015, 17:18

Перетаскивание элемента/переместить по клику
Доброго времени суток. &lt;div&gt; &lt;div id=&quot;polosa&quot;&gt;&lt;div id=&quot;round&quot;&gt;&lt;/div&gt;&lt;/div&gt; ...

Списки: добавление i-ого элемента в любое место списка
Дан односвязный список, нужно организовать добавление iого элемента в любое место списка. Проблема...

Изменить цвет элемента по клику на другом элементе
Нужно чтобы при нажатии на элемент id=&quot;orange&quot; элемент id=&quot;shar&quot; менял цвет &lt;html&gt; &lt;meta...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2019, vBulletin Solutions, Inc.