0

divに2つの画像と2つのボタンがあります。ボタン1をクリックすると、ボタン2と同じように画像1が表示されます..今、私の問題は、体の任意の部分をクリックすると両方の画像を非表示にすることです..今私の問題は、ボディをクリックすると非表示になりますが、ボタンのクリックで画像を表示できないことです。

フィドル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();   
});
4

2 に答える 2

2

試す：

$('#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 の例

クリック機能を誤って使用していました。さらに、ボタンのクリック イベントも、ボディに配置したイベントに DOM をバブリングしていました。

于 2013-10-12T13:10:32.750 に答える
0

これを試して 

 $('body').click(function(e) {
        var target = $(e.target);
        if(!target.is('#btn1') || !target.is('#btn2')) {
           $('#img1').hide();   
         $('#img1').hide();
        }
    });
于 2013-10-12T13:10:58.373 に答える