2012-03-08 6 views
0

나는이 웹 사이트에서 jQuery로이 두 개의 버튼을 가지고 있습니다. bt1을 클릭하면 이미지가 나타나고 첫 번째 이미지는 btn2를 클릭합니다. 이 버튼 btn2에 대한 두 번째 이미지가 사라지고 사라집니다.이미지 및 텍스트를 표시/숨기기위한 Jquery 버튼

문제는 입니다. btn1을 클릭 한 다음 btn2를 클릭하면 btn1로 돌아가 그것을 클릭하면 작동하지 않습니다. 서로를 두 번 클릭하고 클릭하여 이미지를 열고 다른 이미지를 닫아야합니다.

이미지를 보려면 한 번 클릭하고 두 번째 버튼을 클릭하면 첫 번째 이미지가 사라지고 두 번째 이미지가 열립니다.

웹 사이트를 열 때 이미지 **가 나타나기를 원하지만 버튼 (btn1, btn2)을 클릭하면 이미지 숨기기가 사라집니다.

** 3 이미지를하지 않는 (인 btn1/btn2)하지만 난 내 웹을 열 n은 내가 btn 클래스를 -DIVs 부여 도움

<html> 
<head> 

<script type="text/javascript"> 

function showhide_menu(id){ 
    $("#" + id).toggle(); 
} 

</script> 
</head> 
<body> 
<button onclick="showhide_menu('btn1');">Show/Hide. </button> 

<button onclick="showhide_menu('btn2');">Show/Hide. </button> 

<div id="btn1" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 

<div id="btn2" style="display:none;"> 
    <img src="http://www.inquisitr.com/wp-content/2012/02/breaking-dawn-saga.jpg"/> 
    text text text text text text text text text....</div> 

</body> 
</html> 
+0

예제가 작동합니다. http://jsfiddle.net/2gsKq/1/ – bfavaretto

답변

2

에 대한 모든 이미지 감사를 클릭하면 사라질 때 나타납니다. 그런 다음 전환하기 전에 숨길 :

http://jsfiddle.net/qYCUJ/

HTML

<div id="btn1" class="btn" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text.... 
</div> 
<div id="btn2" class="btn" style="display:none;"> 
    <img src="http://www.inquisitr.com/wp-content/2012/02/breaking-dawn-saga.jpg"/> 
    text text text text text text text text text.... 
</div> 

JS가

function showhide_menu(id){ 
    $('.btn:not(#'+id+')').hide(); 
    $("#" + id).toggle(); 
} 
2

당신은 너무

this을 사용할 수 있습니다3210
function showhide_menu(){ 
    if($('#btn1').is(':visible')) 
    { 
     $('#btn1').hide(); 
     $('#btn2').show(); 
    } 
    else 
    { 
     $('#btn2').hide(); 
     $('#btn1').show(); 
    } 
} 
관련 문제