Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.04.2011, 08:18
Аспирант
Отправить личное сообщение для igsavenko Посмотреть профиль Найти все сообщения от igsavenko
 
Регистрация: 15.01.2010
Сообщений: 83

нужна помощь с решением задачи
Объясните, как сделать следующее в JS без jquery чтобы получить следующее:

По нажатию на h1 нужно найти следующий элемент и переключить класс с одного на другой (видимый на не видимый и наоборот)
Этих элементов может быть несколько

<div class = "action">
<h5>Тут Заголовок</h5>
<div class="test">
у этого элемента нужно переключать класс
</div>
</div>
<div class = "action">
<h5>Тут Заголовок</h5>
<div class="test">
у этого элемента нужно переключать класс
</div>
</div>
<div class = "action">
<h5>Тут Заголовок</h5>
<div class="test">
у этого элемента нужно переключать класс
</div>
</div>


Заранее спасибо.
Ответить с цитированием
  #2 (permalink)  
Старый 30.04.2011, 08:56
Аватар для poorking
prodigy
Отправить личное сообщение для poorking Посмотреть профиль Найти все сообщения от poorking
 
Регистрация: 01.11.2010
Сообщений: 503

назначаете обработчик click на h1 (вы так написали, хотя в коде у вас h5), чтобы обратиться в следующей node, у нод есть свойство nextSibling, но в данном примере оно будет указывать на textNode, надо рекурсивно добраться до следующего элемента проверяя каждый раз его nodeType, когда оно == 1, значит это не textNode (у него nodeType == 3), а ваш искомый элемент, назначаете ему нужный className
__________________
readOnly
Ответить с цитированием
  #3 (permalink)  
Старый 30.04.2011, 09:28
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

igsavenko, пользуйтесь поиском Выпадающее меню.
Ответить с цитированием
  #4 (permalink)  
Старый 30.04.2011, 10:04
Профессор
Отправить личное сообщение для with-love-from-siberia Посмотреть профиль Найти все сообщения от with-love-from-siberia
 
Регистрация: 14.12.2009
Сообщений: 155

Сообщение от poorking
назначаете обработчик click на h1
Лучше назначить один обработчик document.onclick (любым удобным способом), в котором определить целевой элемент (h1), найти следующий элемент (поиск nextSibling, у которого div.className == 'test') и его сворачивать/показывать. Рекурсия здесь не нужна.

Последний раз редактировалось with-love-from-siberia, 30.04.2011 в 10:10.
Ответить с цитированием
  #5 (permalink)  
Старый 30.04.2011, 10:43
Аспирант
Отправить личное сообщение для igsavenko Посмотреть профиль Найти все сообщения от igsavenko
 
Регистрация: 15.01.2010
Сообщений: 83

а что вы имеете ввиду под "в котором определить целевой элемент (h1)"?
Ответить с цитированием
  #6 (permalink)  
Старый 30.04.2011, 10:48
Аватар для poorking
prodigy
Отправить личное сообщение для poorking Посмотреть профиль Найти все сообщения от poorking
 
Регистрация: 01.11.2010
Сообщений: 503

with-love-from-siberia,
Естественно лучше один обработчик.
Но как вы разом найдете следующий div у которого класс test? вы будете смотреть nextSibling, потом смотреть не див ли он, потом смотреть какой у него класс, если не подходит, то возьмете nextSibling того nextSiblig-а, и также проверите,
var next = h1elem.hextSibling;
while(next.nodeType != 3 && next.tagName != "DIV" && next.className != "myclass"){
 next = next.nextSibling;
}

next.className = "new_class";

Я вот это имел ввиду под рекусией, не точно сформулировал
__________________
readOnly

Последний раз редактировалось poorking, 30.04.2011 в 15:07.
Ответить с цитированием
  #7 (permalink)  
Старый 30.04.2011, 14:43
Профессор
Отправить личное сообщение для with-love-from-siberia Посмотреть профиль Найти все сообщения от with-love-from-siberia
 
Регистрация: 14.12.2009
Сообщений: 155

Сообщение от poorking
не точно сформулировал
перебор связного списка.

Сообщение от igsavenko
в котором определить целевой элемент (h1)
Событие содержит информацию самом событии и об элементе, с которым это событие связано.

Почитайте: http://javascript.ru/tutorial/events, раздел "Элементы, связанные с событием"
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
нужна помощь в JavaScript михаил Общие вопросы Javascript 26 30.10.2013 11:07
Увеличить размер div'a, нужна помощь. neonick Events/DOM/Window 2 04.03.2011 22:24
Нужна помощь, если можно Fox-WNT Общие вопросы Javascript 3 27.07.2010 11:38
нужна помощь Sergiy Серверные языки и технологии 2 31.03.2010 20:16
нужна помощь dominosoko Серверные языки и технологии 4 14.03.2010 02:17