Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.06.2013, 02:37
Интересующийся
Отправить личное сообщение для Matvey007 Посмотреть профиль Найти все сообщения от Matvey007
 
Регистрация: 08.05.2012
Сообщений: 16

Объясните почему не работает?
Решил сделать самодельный toggle-переключатель. Смысл его прост:
при клике на div скрывается следующий, при повторном клике следующий появляется.
Соответственно составил две части кода для первого и второго действия. Но первое действие выполняется, а второе нет.
Интересует причина такого поведения jQuery!

Код:
<head>
	<script src="http://code.jquery.com/jquery-2.0.0.js"></script>
	<style type="text/css">
		.bold.show-hide {height: 30px; background: #008000;}
		.bold.show-hide-on {background: #00F;}
		.big {height: 30px; background: #F00;}
	</style>
	<script type="text/javascript">
	      $( document ).ready(function() {
                 //part1
                 jQuery(".bold.show-hide").click(function() {
                   jQuery(this).addClass("show-hide-on");
                   jQuery(this).next().css("display", "none");
                 });
                 //part2
                 jQuery(".bold.show-hide-on").click(function() {
                   jQuery(this).removeClass("show-hide-on");
                   jQuery(this).next().css("display", "block");
                 });
          }); 
	</script>
</head>
<body>
	<div class="bold show-hide"></div>
	<div class="big"></div>
</body>


Для наглядности: http://codepen.io/seraphzz/pen/AFxHc

Последний раз редактировалось Matvey007, 03.06.2013 в 05:43.
Ответить с цитированием
  #2 (permalink)  
Старый 03.06.2013, 04:17
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Потому не нужно думать что jQuery - это магическое заклинание.
Это ведь функция, которая, если передать ей селектор, произведет выборку элементов по этому селектору.

Сколько элементов .bold.show-hide-on в момент выполнения скрипта?
Правильно - ни одного.

К слову вы не в том месте вставили свой скрипт. В вашей версии в момент выполнения скрипта не будет найден даже .bold.show-hide, так как <body> еще не загружен. Нужно опустить скрипт ниже, либо установить callback на событе DOMContentLoaded ( $(document).ready() )
Сообщение от Matvey007
Очень интересует причина такого поведения jQuery!
Вот народ жеш. Не знает основ языка, зато пытается анализировать поведение каких-то библиотек.
Ответить с цитированием
  #3 (permalink)  
Старый 03.06.2013, 05:33
Интересующийся
Отправить личное сообщение для Matvey007 Посмотреть профиль Найти все сообщения от Matvey007
 
Регистрация: 08.05.2012
Сообщений: 16

Сообщение от danik.js Посмотреть сообщение
Нужно опустить скрипт ниже, либо установить callback на событе DOMContentLoaded ( $(document).ready() )
Спасибо за подсказку, document.ready я действительно потерял. Уже добавил.
А как тогда надо видоизменить скрипт что бы он заработал?
Ответить с цитированием
  #4 (permalink)  
Старый 03.06.2013, 05:41
Интересующийся
Отправить личное сообщение для Matvey007 Посмотреть профиль Найти все сообщения от Matvey007
 
Регистрация: 08.05.2012
Сообщений: 16

Я переделал вот так:
jQuery("#sidebar .bold.show-hide").click(function() {
		if(jQuery(this).hasClass('show-hide-on')){
		   jQuery(this).removeClass("show-hide-on");
		   jQuery(this).next().css("display", "block");
		} else {
		   jQuery(this).addClass("show-hide-on");
		   jQuery(this).next().css("display", "none");
		}
});

Но может есть более продвинутые варианты?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Почему не работает такой обработчик? Sirius-jack Общие вопросы Javascript 6 04.05.2013 17:26
Помогите с javascript (Почему не работает) remus Оффтопик 9 09.06.2010 11:18
Почему не работает ? hkaren Events/DOM/Window 2 01.06.2010 16:27
Почему не работает код? JSprog Общие вопросы Javascript 4 16.08.2009 14:39
Почему не работает функция? Vitaly jQuery 10 31.07.2009 17:01