Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Помогите новичку (https://javascript.ru/forum/misc/61469-pomogite-novichku.html)

Васик 19.02.2016 19:16

Помогите новичку
 
Здравствуйте.
У меня на странице есть такой код
script type="text/javascript"> function displ(ddd) { if (document.getElementById(ddd).style.display == 'none') {document.getElementById(ddd).style.display = 'block'} else {document.getElementById(ddd).style.display = 'none'} } </script

a href="javascript: displ('var')"> открыть текст про васю</a> <br>
<div id="var" style="display: none;"
вася
a href="javascript: displ('var')"> Закрыть текст про васю</a
</div>
Все работает. Текст открывается. Но, когда хочу еще такой-же код вставить ниже на странице для "пети", - уже не работает, открывает снова васю.
Я понимаю, что вопрос очень глупый наверно, но подскажите пожалуйста, как сделать чтобы обе ссылки работали на одной странице?

Decode 19.02.2016 19:32

<style>
	span {
		display: none;
	}
</style>

<div>
	<button onclick="toggle(this.nextElementSibling)">Toggle</button>
	<span>Вася лох!</span>
</div>

<div>
	<button onclick="toggle(this.nextElementSibling)">Toggle</button>
	<span>Петя лох!</span>
</div>


<script>
	function toggle(elem) {
		elem.style.display = (elem.offsetHeight) ? '' : 'block';
	}
</script>

Васик 19.02.2016 19:54

Спасибо Вам добрый человек!

Васик 19.02.2016 20:26

Может еще подскажите, как быть с тегом <span> в котором находится скрытый текст? Дело в том, что мой скрытый текст довольно большого размера, и там часто встречается этот тег, так вот, все, что в него обернуто - не видно?

Decode 19.02.2016 20:32

<style>
	.hidden {
		display: none;
	}
</style>

<div>
	<button onclick="toggle(this.nextElementSibling)">Toggle</button>
	<span class="hidden"><span style="color: red;">Вася</span> лох!</span>
</div>

<div>
	<button onclick="toggle(this.nextElementSibling)">Toggle</button>
	<span class="hidden"><span style="color: red;">Петя</span> лох!</span>
</div>


<script>
	function toggle(elem) {
		elem.style.display = (elem.offsetHeight) ? '' : 'block';
	}
</script>

Васик 19.02.2016 20:45

Фантастика! Спасибо Большое!


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