2014-01-17 5 views
0

Я пытаюсь полностью скрыть тег span, когда видимость «скрыта» с помощью дисплея: none, который работает отлично, только проблема заключается в том, что инструкция else не работает вообще. Я имею в виду, он должен предупреждать и отображать: блок, но это совсем не так.Оператор JQuery not reach else

$(document).ready(function() { 

     $(".compPass").each(function() { 

      if ($('.compPass').css("visibility") == "hidden") { 
       $('.compPass').css("display", "none"); 
      } 
      else { 
       alert(''); 
       $('.compPass').css("display", "block"); 
      } 
     }); 

    }); 
+0

Вам нужно будет привести пример? Видимость не изменяется при изменении отображения, это свойство CSS, все из которого оно принадлежит, поэтому остальная часть кода не должна влиять на состояние? – adeneo

+0

, чтобы быть уверенным: ваш браузер не кэшировал старую версию вашего java-скрипта (случилось со мной, когда я начал с javascript) –

+0

Я предпочитаю использовать '$ ('. CompPass'). Is (': visible')' – Novocaine

ответ

4

Ссылаясь $(".compPass") внутри .each, вы ссылаетесь всех элементов на странице с этим классом. Используйте $(this) вместо того, чтобы ссылаться на элемент тока:

$(document).ready(function() { 
    $(".compPass").each(function() { 
     if ($(this).css("visibility") == "hidden") { 
      $(this).css("display", "none"); 
     } 
     else { 
      alert(''); 
      $(this).css("display", "block"); 
     } 
    }); 
}); 

Вы также могли бы заменить это с одной функции с помощью функции перегрузки .css():

$(".compPass").css("display", function() { 
    return $(this).css("visibility") === "hidden" ? "none" : "block"; 
}); 

Here is a jsFiddle функции Css перегруженным.

+0

'это' использование верно? Это также изменит все элементы с '.comPass'? –

+0

Нет, он будет определять видимость каждого элемента в свою очередь. Оригинал всегда будет использовать первое свойство видимости в последовательности элементов и применить эту логику ко всем элементам 'compPass' – CodingIntrigue

+0

Это новое .. Я действительно думал, что вам нужно событие, чтобы на самом деле использовать' this' .. Великий .. :) .. Нужно учиться намного больше :) –

0

Else оператор не работает, так как вы не устанавливая visible свойства следующим образом:

$(document).ready(function() { 
    $(".compPass").each(function() { 
      if ($('.compPass').css("visibility") == "hidden"){     
       $('.compPass').css("display", "none"); 
      }else{ 
       $('.compPass').css("display", "block"); 
       $('.compPass').css("visibility", "visible"); 
      } 
    }); 
}); 

Demo: http://jsbin.com/oyEhEpoT/1/

Как @RGraham предложил, .comPass будет переключать все HTML элементы с классом .comPass. Если вам нужно использовать какой-то конкретный, то вы должны использовать как функцию щелчка или любое событие и внутри этого использования:

$(document).ready(function() { 
    $(document).on("click", ".comPass", function (e) { 
      if ($(this).css("visibility") == "hidden"){     
       $(this).css("display", "none"); 
      }else{ 
       $(this).css("display", "block"); 
       $(this).css("visibility", "visible"); 
      } 
    }); 
});