jQuery возврат CSS в исходное состояние

Question

Я добавил событие click, используя jQuery для изменения моего CSS. Щелчок работает и изменения CSS, но затем jQuery продолжает работать и в конечном итоге возвращает CSS обратно в исходное состояние.

JQuery код:

$('.myClass').click(function(){ 
     $('.myClass').css({"visibility":"hidden"}); 
    }); 

CSS код:

.myClass { 
    height: 10px; 
    width: 10px; 
    background: red; 
    visibility:visible; 
    } 

Как я уже говорил, нажмите работы и элемент получает скрыт. Тем не менее, он мгновенно возвращается обратно, когда jQuery заканчивает выполнение своего кода. Используя инструмент отладчика Google Chrome, я вижу, что это точка в коде jQuery, которая возвращает CSS обратно, чтобы этот элемент был видимым.

код JQuery (в строке 4116):

if (!(eventHandle = elemData.handle)) { 
     eventHandle = elemData.handle = function(e) { 
      // Discard the second event of a jQuery.event.trigger() and 
      // when an event is called after a page has unloaded 
      return typeof jQuery !== strundefined && jQuery.event.triggered !== e.type ? 
line 4116  jQuery.event.dispatch.apply(elem, arguments) : undefined; 
     }; 
    } 

Я предполагаю, что я не понимаю, что происходит с этим кодом JQuery и почему мой CSS получает вернулся назад? Любая помощь в понимании очень ценится.

Answer 1

Вы можете попробовать просто переключить класс, который имеет «видимость: скрытый», чтобы избежать проблемы вообще.

#CSS 
.vh{ 
    visibility:hidden 
    #or you could use display:none 
} 

#Javascript 
$('.myClass').click(function(){ 
    $('.myClass').toggleClass('vh'); 
}); 

Сообщите мне, если это вам помогло. -Mike

Answer 2

Моя догадка заключается в том, что по мере того, как ваша страница запускается, есть и другие запущенные CSS или jQuery и переписывающие «видимость: hidden»; Я также рекомендовал бы переключить ваш класс и использовать «display: block;» и 'display: none' over 'visibility: hidden'.

Если вы предоставите остальную часть своего HTML и jQuery, я могу дать вам более точный ответ.