Форум

Nifler · #1 (**permalink**) 23.04.2015, 23:49

Не могу определить элемент по его css стилю. вот какой у меня код:

<span id="clikaem">Klikni</span>

(function($,andefined){	
	$(document).ready(function(){
		if($("#clikaem").css("color")=="red"){
			$("#clikaem").click(function(){
				$("#clikaem").css("color","blue");	
			})
		}else{
			$("#clikaem").click(function(){
				$("#clikaem").css("color","#ff0000");	
			})	
		}		
	})
})(jQuery)

В теории должно при поочередных нажатиях изменять цвет с червоного на синий и наоборот. но оно никогда не определяет значение внутри if как тру. я даже алертом выводил

alert($("#clikaem").css("color"));

ответ был вот таким rgb(255, 0, 0) вставлял внутрь if, но не срабатывало.
Как мне поймать состояние стиля css элемента, и почему этот if не работает?

рони · #2 (**permalink**) 24.04.2015, 00:13

Nifler,
$("#clikaem").css("color") будет везде разный -- сделайте сравнение по классу а не по значению ксс

рони · #3 (**permalink**) 24.04.2015, 00:16

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

В теории должно при поочередных нажатиях изменять цвет с червоного на синий и наоборот

этого в вашем коде нет!!! даже будь значение == "red"

рони · #4 (**permalink**) 24.04.2015, 00:25

Nifler,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var red = $("#clikaem").css("color","red").css("color");
       $("#clikaem").click(function() {
         if ($(this).css("color")== red) $(this).css("color","blue");
         else $(this).css("color","red");
      });
});


  </script>
</head>

<body>
<span id="clikaem">Klikni</span>
</body>

</html>

Nifler · #5 (**permalink**) 24.04.2015, 11:35

да, разобрался. у меня проверка шла до того, как проверялось событие клик. и кажется из-за этого весь трабл.
а еще спс за вот этот код
var red = $("#clikaem").css("color","red").css("color");
так реально оно определенно поймет о каком цвете я говорю)

рони · #6 (**permalink**) 24.04.2015, 11:49

Nifler,
нормальный код для таких случаев

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    #clikaem{
      color: Red;
    }
    #clikaem.blue{
      color: Blue;
    }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
         var clik = $("#clikaem");
         clik.click(function() {
         clik.toggleClass('blue')
      });
});
  </script>
</head>

<body>
<span id="clikaem">Klikni</span>
</body>
</html>

Nifler · #7 (**permalink**) 27.04.2015, 11:01

С этим разобрался, спс. А теперь вопрос немного не по теме, как отследить изменение DOM со временем? Пока что пришло в голову периодически проганяться по всех интересующих элементах, но это бред.
http://javascript.ru/forum/showthrea...449#post368449
вот тему создал, там детальней вопрос рассписал. Посмотри, если есть время.

Форум

Справочник

Discord чат

Курсы javascript