Question

我有一個div中的兩個圖像和兩個按鈕，現在過程是當我點擊按鈕1，然後圖像1顯示與按鈕2相同..現在我的問題是我希望兩個圖像隱藏當我點擊身體的任何部分..現在我的問題是當我點擊身體它會隱藏，但無法顯示按鈕點擊圖像。

小提琴Here

HTML

<input type='button' id='btn1' value='button1'> 
    <img src="abc.jpg" id='img1'> 
     <input type='button' value='button2' id='btn2'> 
    <img src="abc.jpg" id='img2' > 

的js

$('#btn1').click()(function(){ 
     $('#img1').show(); 
         $('#img2').hide(); 
        }); 
$('#btn2').click()(function(){ 
     $('#img2').show(); 
         $('#img1').hide(); 
        }); 

$('body').click()(function(){ 
$('#img1').hide(); 
    $('#img1').hide(); 
}); 

Answer 1

嘗試：

$('#btn1').click(function (e) { 
    e.stopPropagation(); 
    $('#img1').show(); 
    $('#img2').hide(); 
}); 
$('#btn2').click(function (e) { 
    e.stopPropagation(); 
    $('#img2').show(); 
    $('#img1').hide(); 
}); 
$('body').click(function() { 
    $('#img1,#img2').hide(); 
}); 

jsFiddle example

您正在錯誤地使用點擊功能，再加上按鈕上的點擊事件也會將DOM暴露給您放置在主體上的事件。

Answer 2

試試這個

$('body').click(function(e) { 
     var target = $(e.target); 
     if(!target.is('#btn1') || !target.is('#btn2')) { 
      $('#img1').hide(); 
     $('#img1').hide(); 
     } 
    });