Question

这是我的jquery：

$(document).ready(function() {
$('#our_location').click(function(){

    $('#locations').show();

    });

$('#locations a').click(function(){
    $('#f_w').hide();


    var id = $(this).attr('id');

$.ajax({
       type: "POST",
       url: "map_response.php",
       data: ({id: id}),
       success: function(response){
        //alert(response);
        $('#map_n_vilage').html(response);
        $('#map_n_vilage').show();
        $('.villages').show();
       }
   });


    });

});

当我点击链接#our_location时，会打开div #locations。当我点击#locations中的任何锚标签时，会调用ajax并显示#map_n_vilage div ...现在我想要的是，如果我点击除这些div之外的任何其他东西，我所有这些div都会消失

Answer 1

创建隐藏div的函数：

function hideDivs() {
   $('.villages').hide();
   $('#map_n_vilage').hide();
   $('#locations').hide();
}

您可以将此附加到任何被点击的div的新处理程序，只执行hideDivs的名称不等于villages，map_n_village，locations。您还可以使用:visible选择器检查它们是否可见。

Answer 2

通常由于事件冒泡，每当点击html页面上的任何内容时，正文也会获得点击事件。所以像这样：

$("body").click(function(e) {
  if (e.target.id != "your-main-div-id") {
    //hide whatever div you want to hide
   }
 });

其中main-div-id应该是某个控件的id，如果被点击，你不想隐藏你的div。您甚至可以删除该部分，但我认为您需要这样做。

单击div时隐藏活动div

2 个答案: