2016-07-08 4 views
3

Я хочу скрыть ссылку с jquery, если пользователь нажмет кнопку в первый раз, ссылка скроется (по добавление класса скрыто), но должно показать, если кнопка клика второй раз (удалить класс скрыт). его функция переключения коллапса. Когда я нажимаю кнопку в первый раз, она скрывает, но второй раз не работаетпоказать/скрыть ссылку с jquery

HTML

 <!--BUTTON --> 
<div class="sidebar-collapse" style="" id="sidebar-collapse"> 
       <a href="#" class="sidebar-collapse-icon with-animation"> 

        <i class="entypo-menu"></i> 
       </a> 
      </div> 
<a href="mysite_url" id="logo-title"> <br> My Site Name </a> 

JAVASCRIPT

<script> 
    var logo_title = $('a#logo-title'); 
    $('div#sidebar-collapse').click(function(){ 
     logo_title.addClass('hidden-md hidden-lg cj_inspired'); 
     if($('div#sidebar-collapse').click() && logo_title.hasClass('cj_inspired')){ 
      $('a#logo-title').removeClass('hidden-md hidden-lg cj_inspired'); 
     } 
    }) 
</script> 
+0

предоставить jsfiddle? – Thinker

+0

какая ошибка вы получаете? –

ответ

2

Вы можете скрыть показать ссылку, как это:

$('div#sidebar-collapse').click(function(){ 
 
    if ($("#logo-title").is(":visible")) { 
 
    $("#logo-title").hide(); 
 
    } else if ($("#logo-title").is(":hidden")) { 
 
    $("#logo-title").show(); 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="sidebar-collapse" style="" id="sidebar-collapse"> 
 
    <a href="#" class="sidebar-collapse-icon with-animation"> 
 
     Click    
 
     <i class="entypo-menu"></i> 
 
    </a> 
 
</div> 
 
<a href="mysite_url" id="logo-title"> <br> My Site Name </a>

+0

Это сработало спасибо – 4Jean

+0

@ 4Jean отметьте это правильно :) –

1

Вы можете использовать jQuerys toggleClass() для переключения одного класса на/выключения элемента:

<script> 
    var logo_title = $('a#logo-title'); 
    $('div#sidebar-collapse').click(function(){ 
     logo_title.toggleClass('hidden-md').toggleClass('hidden-lg').toggleClass('cj_inspired'); 
    }); 
</script> 

Это было бы более элегантный, если вы можете использовать один класс для определения скрытых стилей.

Подробнее о toggleClass()here.

2

Попробуйте:

<script> 
 
$(document).ready(function(){ 
 
    $('.sidebar-collapse').click(function(){ 
 
\t $('#logo-title').toggle(); 
 
}); 
 
}); 
 
</script>
<div class="sidebar-collapse" style="" id="sidebar-collapse"> 
 
       <a href="#" class="sidebar-collapse-icon with-animation"> 
 

 
        <i class="entypo-menu"></i>Click 
 
       </a> 
 
      </div> 
 
<a href="mysite_url" id="logo-title"> <br> My Site Name </a>

это будет работать ..

+0

Код работал тоже – 4Jean

Смежные вопросы