Question

我并不擅长JQUERY，我只是倾向于观察事物，但这是我一直在努力的代码。所以我的目标是，当我点击屏幕上的任意位置时，我希望关闭 .people 和 .people_bg 。

<script>
$(document).ready(function(){
  $("#relations").click(function(){
    $(".people").slideToggle("fast");
    $(".people_bg").slideToggle("fast");
  });
});


$('a.close, .people_bg').live('click', function() {
$('.people_bg , .people').fadeOut(function() {
$('.people_bg, a.close').remove(); //fade them both out
});
return false;
});
});
</script>

问题是：只能一次。第二次，只有＆＃39; .people＆＃39;出现，而不是＆＃39; .people_bg＆＃39;

Answer 1

您正在使用的删除功能实际上会从页面中删除元素，因此这是您的罪魁祸首。用更合适的功能替换它，你应该没问题。

Answer 2

您只需fadeOut而不remove。这将隐藏它们而不实际从页面中删除它们：JS FIDDLE

$('a.close, .people_bg').on('click', function () {
    $('.people_bg , .people').fadeOut();
});

此外，在第一个函数中，您可以组合两个类选择器：

$("#relations").click(function () {
    $(".people, .people_bg").slideToggle("fast");
});

另请注意，从版本1.7开始，您应该使用jquery的.on()而不是.live()。

第二个div在点击两次后不会再回来

2 个答案: