Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Логика спойлера (https://javascript.ru/forum/events/2533-logika-spojjlera.html)

twolf 11.01.2009 17:17

Логика спойлера
 
Добрый день.
Подскажите логику как сделать спойлер.
Что сделано:
структура HTML
<div class="a">видимый текст
 <div class="b">текст который надо скрыть/показать</div>
</div>
...........
<div class="a">видимый текст
 <div class="b">текст который надо скрыть/показать</div>
</div>

Вешаю на все классы "a" событие, которое показывает/скрывает дочерний div.
Это все работает, но при клике на дочерний див, срабатывает событие.
Вот тут я пришел в тупик.
Подскажите логику.
Спасибо

ZoNT 11.01.2009 18:41

при клике на дочерний див надо останавливать "всплытие" событие. Почитай про event.cancelBubble=true и event.stopPropogation();

Ilya 11.01.2009 18:46

Необходимо было видимый текст поместить в отдельный контейнер (например span), и только после этого вешать на него (span) событие.

1)

http://chernev.ru/delaem-prostejshij-spojler.html

2)

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var vr4 = true;
function fn1() {
	var vr1 = document.getElementById("id1");
	var vr2 = document.getElementById("id2");
	var vr3 = "текст который надо скрыть/показать";
	if(vr4 == true) {
		vr2.innerHTML = vr3;
		vr4 = false;
	}
	else {
		vr2.innerHTML = "";
		vr4 = true;
	}
}
</script>
</head>
<body>
<div><span id="id1" style="cursor: pointer;" onmousedown="fn1()">видимый текст</span>
<div id="id2"></div>
</div>
</body>
</html>

twolf 12.01.2009 13:11

Цитата:

Сообщение от Ilya (Сообщение 10571)
Необходимо было видимый текст поместить в отдельный контейнер (например span), и только после этого вешать на него (span) событие.

спасибо :)
только я не понял причем тут jquery

http://www.freekick-game.ru/faq

Ilya 14.01.2009 03:50

Так на всякий случай. :)


Часовой пояс GMT +3, время: 01:11.