Форум

jsuse · #1 (**permalink**) 01.12.2011, 22:23

Как в jQuery реализуются условия?
Вот допустим есть код:

button.onclick = function() {
if (div.style.display == "none") {
  div.style.display = "block";
else {
  div.style.display = "none";
}

Как такое условие реализовать с jQuery?

Вот мой код и он не работает.

$("#button").live("click", function() {
	if ($("#div").attr("display") == "none") {
		$("#div").attr("display","inline-block");
		$("#div").slideDown();
	}
	else {
		$("#div").slideUp();
		$("#div").attr("display","none");
	}	
});

Возможно ли вообще это в jQuery?

devote · #2 (**permalink**) 01.12.2011, 23:11

попробуй вместо attr использовать css

Pavel M. · #3 (**permalink**) 02.12.2011, 11:21

Сообщение от jsuse

Как в jQuery реализуются условия?
Вот допустим есть код:
1 button.onclick = function() {
2 if (div.style.display == "none") {
3 div.style.display = "block";
4 else {
5 div.style.display = "none";
6 }

Как такое условие реализовать с jQuery?

можно так

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>demo</title>
  <script type='text/javascript' src='http://code.jquery.com/jquery-git.js'></script>
</head>
<body>
	<button>button</button>
	<div>div</div>

	<script>
		$('button').click(function () {
			$('div').toggle();                  
		});
	</script>
  
</body>
</html>

jsuse · #4 (**permalink**) 02.12.2011, 21:47

Спасибо всем, хорошие решения.
Но то, что я написал в теме все таки работает. Получилось я здесь без ошибок написал, а в коде допустил ошибку - не поставил # для указания id. Вот и не работало.

Поэтому ответ такой. Условия else/if в jQuery реализуются.

Но тоже как-то странно. При else/if условиях событие click почему-то срабатывает только со второго клика по элементу. Если без сложных условий, то работает как надо, с одного клика. При else/if чего-то подглючивает.

trikadin · #5 (**permalink**) 02.12.2011, 22:08

Сообщение от jsuse

Условия else/if в jQuery реализуются.

Условия реализуются в JS, jQ - всего лишь библиотека...

ksa · #6 (**permalink**) 02.12.2011, 23:34

jsuse, нет там никаких "особенностей"... Просто писать нужно правильно...

Porebro · #7 (**permalink**) 25.09.2015, 18:49

Ребята , очень похожая проблема

Код:

$(function(){
			var test = $('.hidden')
			if (test.css('display')=='none') {
						
			$('#spoiler').click(function(){
				$('.hidden').slideDown();
				$('#spoiler').text('Скрыть');
			});
			};
			else{
				$('#spoiler').click(function(){
				$('.hidden').slideUp();
				$('#spoiler').text('Показать');
			};
		});

Условие срабатывает , но когда код доходит до "else" то пишет ошибку в консоле:"Uncaught SyntaxError: Unexpected token else"

сам код здесь :https://jsfiddle.net/hsxx83g2/

laimas · #8 (**permalink**) 25.09.2015, 18:53

Еще бы, у вас скобки как попало разбросаны, а не как положено.

рони · #9 (**permalink**) 25.09.2015, 20:02

Porebro,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
*{
  box-sizing: border-box;
}

.hidden{
	display: none;
}
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
 $(function(){
			var $hidden = $('.hidden'), $spoiler = $('#spoiler')
			$spoiler.click(function(){
                $spoiler.text(['Показать','Скрыть'][+$hidden.is(':hidden')]);
                $hidden.slideToggle();
			});
		});

  </script>
</head>

<body>

	<div >
		Служба Яндекс.Рефераты предназначена для студентов и школьников, дизайнеров и журналистов, создателей научных заявок и отчетов — для всех, кто относится к тексту, как к количеству знаков.
		</div>


		<div class="hidden">	Нажав на кнопку «Написать реферат», вы лично создаете уникальный текст, причем именно от вашего нажатия на кнопку зависит, какой именно текст получится — таким образом, авторские права на реферат принадлежат только вам.

			Теперь никто не сможет обвинить вас в плагиате, ибо каждый текст Яндекс.Рефератов неповторим.

			Текстами рефератов можно пользоваться совершенно бесплатно, однако при транслировании и предоставлении текстов в массовое пользование ссылка на Яндекс.Рефераты обязательна.

	</div>

	<button id="spoiler">Показать</button>

</body>

</html>

Форум

Справочник

Discord чат

Курсы javascript