Question

为什么点击圈子图片，div不使用javascript切换？

当我点击灰色方块时，它会切换好。

但是，点击圆形图像时，为什么切换不起作用。我该怎么做才能工作。

<img src="http://images.wikia.com/gtawiki/images/archive/3/3e/20090730000919!PS3_Circle.png" style=" border: none;" id="image_test" onclick="showDivtest('div1')" />

http://jsfiddle.net/a3MKG/40/

<script>
function showDiv(id) {    
  $("#div1").toggle();
}    

$(document).click(function(e) { 
   if( !$('#image_test').is( e.target ) )
      $("#div1").hide();
});
</script>

Answer 1

你有几个问题。重复的ID是无效的HTML（我将其从IMG中删除）。您还应该避免使用jQuery事件处理程序混合内联单击处理程序（只需使用jQuery处理程序）。此外，您需要停止原始的打开点击，然后再传播到document，因为它会立即再次关闭。

这是一个经过简化的简化版本：

JSiddle： http://jsfiddle.net/a3MKG/54/

$('#image_test').click(function (e) {
    e.stopPropagation();
    $("#div1").toggle();
});

$(document).click(function (e) {
    if ($(e.target).closest("#div1").length == 0) {
        $("#div1").hide();
    }
});

我使用closest来确定所点击的元素是显示的选项，还是选项的后代（因此点击LI或UL将执行相同的工作）。

为什么单击圆形图像，div不使用javascript切换？

1 个答案: