<MyRusakov.ru />

Профессия Web-разработчик

Профессия Web-разработчик

Этот комплект за 8 месяцев превратит Вас в Web-разработчика с нуля. Учиться достаточно 1 час в день.

Начнёте Вы с HTML, CSS и вёрстки сайтов. Потом перейдёте к программированию и JavaScript. Затем изучите PHP, MySQL, SQL, Python. Изучите Web-фреймворки Laravel и Django. Создадите 5 своих сайтов для портфолио.

Комплект содержит:

- 540 видеоуроков

- 110 часов видео

- 1205 заданий для закрепления материала из уроков

- 5 финальных тестов

- 7 сертификатов

- 12 Бонусных курсов

Подробнее
Уроки и статьи
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Форум сайта MyRusakov.ru

Возникновение события при изменении checkbox
22.11.2011 03:55:42 Возникновение события при изменении checkbox Сообщение #1
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

Вопрос по статье "Возникновение события при изменении checkbox на JavaScript".

Создаю районную электронную Книгу Памяти. Есть несколько списков:
1.1. Погибшие, призванные "нашим" РВК
1.2. Погибшие, призванные "чужими" РВК
2. Судьба не установлена (воевали, но погибли или выжили - не известно)
3.1. Вернувшиеся, призванные "нашим" РВК
3.2. Вернувшиеся, призванные "чужими" РВК
4. Осужденные военным трибуналом.

Сейчас все списки отдельные. Есть идея их все объединить в алфавитном порядке, но что бы каждая запись была под своим ID (с различным цветом фона), и открывать нужные (или все сразу) по соответствующим чекбоксам.

Списки нумерованные (через OL), отдельной строкой (DIV) ФИО, отдельно (DIV) - "подробности" о судьбе. "Подробности" скрыты в сполер, который по клику на ФИО открывается/закрывается.

Трудности - на некоторых лиц есть отдельная страница с описанием, которая открывается по текстовой ссылке, выполненной через ФИО. И сполер так же должен открываться по клику/ссылке на ФИО. (Так же предполагается выполнить переходы по якорям на страницы с памятниками, но тут видимо нужно делать через ссылку на картинку, помещенную возле фамилии)

Списки разбиты по первой букве фамилии. Количество записей по каждой букве - различное (от единиц на "Э" до более 1000 на "К". Списки не окончательные, идет постоянное изменение, добавление, редактирование.

Вопрос: как организовать массив и что принять за ID, по которому нужно делать перебор? (ведь хочется, что бы скрипт был один на все страницы, а количество записей в них - разное).

Понимаю, что смутное объяснение, конечно же..
Профиль
09.03.2012 08:15:14 Возникновение события при изменении checkbox Сообщение #2
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

не хватает ума...
что получилось, дальше не знаю, что делать, помогайте, плиз!


<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8 />


<script type="text/javascript">
<!--
function show_hide_block(xdata){ obj=xdata.parentNode.childNodes[1].style; tmp=(obj.display!='block') ? 'block' : 'none'; obj.display=tmp; return false; }


function showOrHide(cb, cat) {
cb = document.getElementById(cb);
cat = document.getElementById(cat);
if (cb.checked) cat.style.display = "block";
else cat.style.display = "none";
}
-->
</script>

</head>
<body>
<header>
<nav>


<div>
<input type = 'checkbox' id = 'cb2' onclick = 'showOrHide("cb2", "cat2";'/>погибли<br />
<input type = 'checkbox' id = 'cb3' onclick = 'showOrHide("cb3", "cat3";'/>вернулись<br />
<input type = 'checkbox' id = 'cb4' onclick = 'showOrHide("cb4", "cat4";'/>не установлено<br />
<input type = 'checkbox' id = 'cb1' onclick = 'showOrHide("cb1", "cat1";'/>подробно
</div>


</nav>
</header>
<fieldset>
<legend class="leg"><b>Книга Памяти</b></legend>
<section>
<ol>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 1</b></a><div id = 'cat1' style = 'display: none;'>подробности 1: призван погиб</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 2</b></a><div id = 'cat1' style = 'display: none;'>подробности 2: призван вернулся</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 3</b></a><div id = 'cat1' style = 'display: none;'>подробности 3: призван погиб</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 4</b></a><div id = 'cat1' style = 'display: none;'>подробности 4: призван вернулся</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 5</b></a><div id = 'cat1' style = 'display: none;'>подробности 5: призван</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 6</b></a><div id = 'cat1' style = 'display: none;'>подробности 6: призван погиб</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 7</b></a><div id = 'cat1' style = 'display: none;'>подробности 7: призван вернулся</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 8</b></a><div id = 'cat1' style = 'display: none;'>подробности 8: призван вернулся</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 9</b></a><div id = 'cat1' style = 'display: none;'>подробности 9: призван погиб</div></div></li>
<li><div><a title="подробности" onclick="show_hide_block(this)"><b>ФИО 10</b></a><div id = 'cat1' style = 'display: none;'>подробности 10: призван</div></div></li>
</ol>
</section>


</fieldset>

</body>
</html>
Профиль
09.03.2012 12:10:13 Возникновение события при изменении checkbox Сообщение #3
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Вы здесь расписали целую историю. Вы поставили несколько абсолютно различных задач и хотите всё это смешать в кучу и чтобы всё было сразу. Так не бывает. Забудьте обо всём, оставив только что-то одно. Например, по клику по элементу открывается внутренний div. Сделали, переходите к следующей задаче. За ID всегда принимается отдельный человек.
Профиль
09.03.2012 12:31:39 Возникновение события при изменении checkbox Сообщение #4
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

это я понимаю. понимаю, что нужно сделать цикл с проверкой на 2 (или же более) условия..
1. - открыт или закрыт div
2. - конец списка
но как это сделать - не пойму..

по этому остановился пока на внутреннем DIV, скрывающем "подробности", но как заставить обрабатывать все записи - не пойму...
Профиль
09.03.2012 13:29:17 Возникновение события при изменении checkbox Сообщение #5
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Чего их обрабатывать? Вывели все в нужные места и всё. Далее через JS раскрывайте те записи, которые выбрал пользователь (уже объяснял как, да и Вы это уже сделали).
Профиль
09.03.2012 13:35:22 Возникновение события при изменении checkbox Сообщение #6
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

вот тут то и возникает вопрос (непонятки) - что и куда вывести?
у меня открывается только первая запись (За ID всегда принимается отдельный человек),
а мне нужно, что бы JS проходил все записи..
что то не так делаю, но не пойму - что
Профиль
09.03.2012 13:41:12 Возникновение события при изменении checkbox Сообщение #7
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

За ID принимайте группу записей, то есть весь div. Когда кликают по соответствующему li открывайте весь div со всеми ФИО.
Профиль
09.03.2012 13:46:58 Возникновение события при изменении checkbox Сообщение #8
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

вот тут то и возникает вопрос (непонятки) - что и куда вывести?
у меня открывается только первая запись (За ID всегда принимается отдельный человек),
а мне нужно, что бы JS проходил все записи..
что то не так делаю, но не пойму - что.

Задача 1
первоначально так, как есть - видны только ФИО. Если ищут только своего родственника, то щелкая по его ФИО открывается подробная запись о нем. и так, вручную можно открыть сколько угодно (спойлеры).
Но кликая по "подробностям" можно открыть или закрыть у всех сразу эти скрытые записи.
Профиль
09.03.2012 13:55:05 Возникновение события при изменении checkbox Сообщение #9
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

ФИО находится в li. Подробности скрыты в div. У div можно поставить id. После клика по li открывается этот div. Когда хотят открыть все сразу, нужно пройтись по всем li и открыть внутри каждого div.
Профиль
09.03.2012 14:16:10 Возникновение события при изменении checkbox Сообщение #10
Михалыч

Михалыч

Новичок

Новичок

Дата регистрации:
19.11.2011 14:44:12

Сообщений: 13

сейчас:
<li>
... <div> ФИО
...... <div>подробности
...... </div>
... </div>
</li>


нужно пройтись по всем li и открыть внутри каждого div
- для этого и нужен цикл, как я понимаю, что бы ройтись по всем li.
при этом id во внутренних div будут одинаковыми, но в разных li
или не так?

Задача 2 - на будущее
на эти li поставить еще один div, который и будет "отвечать" за первые чикбоксы
Профиль