2012-01-27 15 views
0

我有以下代碼來切換列表中的元素,當父div「.row」被點擊以顯示更多的內容「.ExpandPane」但是,當該父母div內的鏈接「.row」是點擊他們也激活切換功能如何獲取鏈接Wthin父Div不切換

有沒有辦法我可以解決這個問題我想能夠點擊父div中的任何地方「.row」,但允許該父母div中的鏈接「 .Row「作爲正常工作,而不是激活切換功能。

的Html

<div class="Row"> 
    <a class="acceptBtn"></a> 
    <p>content.....</p> 
    <div class="ExpandPane"></div> <!-- hidden --> 
</div> 
<div class="Row"> 
    <p>content...</p> 
    <a class="acceptBtn"></a> 
    <div class="ExpandPane"></div><!-- hidden --> 
</div> 
<div class="Row"> 
    <p>content....</p> 
    <a class="acceptBtn"></a> 
    <div class="ExpandPane"></div><!-- hidden --> 

</div> 

JQuery的

$(".Row").toggle(
     function() { 
     $(this).find('.ExpandPane').show(); 
     //$(this).find('.PhotoShow').hide(); 
     //$(this).find('.PhotoHide').show(); 

     }, 
     function() { 
     $(this).find('.ExpandPane').hide(); 
     //$(this).find('.PhotoHide').hide(); 
     //$(this).find('.PhotoShow').show(); 
     }); 


$(".acceptBtn").click(function(event) { 
    alert("hi"); 
}); 

回答

0
$(".acceptBtn").click(function(event) { 
    alert("hi"); 
    event.stopPropagation(); 
}); 

stopPropagation()阻止事件向上冒泡到父div的。另外,這個問題已經在SO上回答了大約100次。