JQuery, Переключить два элемента одним щелчком мыши, один элемент должен появиться, а другой должен быть скрыт

У меня есть два div и кнопка. Я хочу, чтобы один div был виден на клике, который имеет свойство отображения none, а другой div должен быть скрыт.JQuery, Переключить два элемента одним щелчком мыши, один элемент должен появиться, а другой должен быть скрыт

И это должно переключаться. Следующий клик. Второй элемент должен быть видимым, а первый должен быть скрыт.

Я не знаю JQuery.

Как это достичь?

Я пытался это ...

<script> 
     $(document).ready(function(){ 
      $("#filter").click(function(){ 
      $("#sidebar").toggle(function(){ 
       $("#sidebar").hide(); 
       $(".right-box").show(); 
      }, function(){ 
       $("#sidebar").show(); 
       $(".right-box").hide(); 
      }); 
     }); 
    }); 
</script>

Это не работает нормально. Девы появляются и исчезают в мгновение ока

источник

2015-07-15 Abdul Qhayum

поделиться своим html и пройти через jquery api, чтобы посмотреть, как вы можете это сделать. –

начать с http://learn.jquery.com/ –

Надеюсь, это полезно для вас.

HTML:

<div id='content'>Hello World</div> 
<input type='button' id='hideshow' value='hide/show'>

Jquery:

jQuery(document).ready(function(){ 
jQuery('#hideshow').live('click', function(event) {   
    jQuery('#content').toggle('show'); 
}); 
});

Demo

источник

2015-07-15 06:22:35 Amarjit

Не работает человек. Пытался. У меня есть кнопка и два разных div. Я хочу переключить эти div. При щелчке по кнопке должен появиться один div (по умолчанию отображается свойство none), а другой видимый div должен скрываться. –

Вы overthinking его.

$(document).ready(function(){ 
 
     $(".show").click(function(){ 
 
      $(".shown").fadeToggle('slow'); 
 
      $(".hidden").fadeToggle('slow'); 
 
    }); 
 
    });

Смотрите эту скрипку: http://jsfiddle.net/yomisimie/noc0fqz1/

источник

2015-07-15 12:00:28 yomisimie

<!DOCTYPE html> 
    <html> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
     $("#hide").click(function(){ 
      $("#a").show(); 
      $("#b").hide(); 
     }); 
     }); 
     $(document).ready(function(){ 
     $("#show").click(function(){ 
     $("#b").show(); 
     $("#a").hide(); 
     }); 
     }); 

    </script> 
    </head> 
    <body> 

    <div id="a">If you click div 1 , it will show</div> 
    <div id="b">If you click div 2, it will show </div> 
    <button id="hide">div 1</button> 
    <button id="show">div 2</button> 

    </body> 
    </html>

Надеется, что это будет работать, как вам необходимо.

источник

2015-07-16 06:30:25 vipin

JQuery, Переключить два элемента одним щелчком мыши, один элемент должен появиться, а другой должен быть скрыт

ответ

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