嵌套的彈出窗口打開和關閉按鈕

Question

我想在一個頁面中使用兩個jquery函數有多個彈出窗口。其中之一是一個打開彈出窗口的按鈕（它嵌套在按鈕本身內，以便將彈出窗口放置在按鈕旁邊）。另一個函數是一個應該關閉彈出窗口的按鈕（它位於嵌套div內）。

問題是，構成第一個按鈕的div將它的功能擴展到打開的彈出窗口，有效地使它每當我想關閉彈出窗口時都會再次打開。 （或者至少這是我想它，因爲畢竟我取消嵌套從彈出的打開按鈕，事情開始工作）

下面是JavaScript的

代碼

jQuery(document).ready(function(){ 

$(".button_open").click(function() 
{ 
$(this).children().css("display","inline"); 
}); 

$(".button_close").click(function() 
{ 
$(".pop-up").css("display","none"); 
}); 

}); 

的Html

<div class="button_open"> 
<div class="pop-up"> 
    <div class="button_close">X</div> 
Text 
</div> 
</div> 

該頁面將有多個彈出窗口每一個包含不同的東西，如果可能的話，我想有這兩個函數執行而不是有一噸的功能全部打開/關閉的東西。

所以基本上我想知道是否有使div嵌套

Answer 1

內的關閉按鈕功能的任何方式。如果您在您關閉按鈕點擊 - 你讓父也是一個點擊。 試着讓你的代碼，以便：

$(".button_close").click(function(event) 
{ 
    $(".pop-up").css("display","none"); 
    event.stopPropagation(); 
}); 

stopPropagation功能阻止事件的冒泡到父。那麼它不應該冒泡給父母，並且不應該引起對父母的點擊。請讓我知道，如果它沒有幫助。