jQuery：當在外部點擊時隱藏彈出窗口div時出現錯誤

Question

我有幾個彈出窗口塊。當你點擊一個鏈接時，每一個都會打開，並且電源被一個楔子隱藏在元素之外。錯誤：如果您先點擊第二個鏈接「Link-2」（出現Block-2），然後點擊「Link-1」（出現Block-1），點擊外部元素後它不會消失。

Demo on jsfiddle

我的jQuery代碼

$('.open_btn').click(function(e) { 
    $(".p_block").addClass('box_hidden'); 
    var popup = $(this).attr('href');  
    if ($(popup).hasClass('box_hidden')) { 
     $(popup).removeClass('box_hidden'); 
     var firstClick = true; 
     $(document).bind('click.myEvent', function(e) { 
      if (!firstClick && $(e).closest($(popup)).length == 0) { 
       $(popup).addClass('box_hidden'); 
       $(document).unbind('click.myEvent'); 
      } 
      firstClick = false; 
     }); 
    } 
    e.preventDefault(); 
}); 

Answer 1

有一個解決方案。

jsfiddle

$('.open_btn').click(function(e) { 
$(".p_block").addClass('box_hidden'); 
var popup = $(this).attr('href'); 
if ($(popup).hasClass('box_hidden')) { 
    $(popup).removeClass('box_hidden'); 
    var firstClick = true; 
    $(document).bind('click.myEvent'+popup, function(e) { 
     if (!firstClick && $(e).closest($(popup)).length == 0) { 
      $(popup).addClass('box_hidden'); 
      $(document).unbind('click.myEvent'+popup); 
     } 
     firstClick = false; 
    }); 
} 
e.preventDefault(); 
});