事件停止與兒童事件傳播問題

我有jquery停止傳播的問題。要關閉車模式時，我除了在車模式在頁面上點擊，我不得不這樣做：事件停止與兒童事件傳播問題

 $('html').click(function() { 
      $('.cart-block').css('display','none'); 
     }); 

     $('.mycart, .cart-block').click(function(event){ 
      event.stopPropagation(); 

     });

但我有一個問題，我有一個AJAX調用刪除我的車格內的項目（購物車塊），但停止傳播正在停止該事件。

$(document).on('click', '.deleteItem', function() { 
    //ajax call 
});

有人可以幫助我嗎？非常感謝（對不起，我的英語）

編輯：HTML結構 //按鈕購物車

<div class="center cart mycart" > 
      //icon and cart item counter 
      </div> 

     <div id="cartcaption" class="cart-block"> 
    //modal : content of the cart 
<div class="productsPanier"> 
<span id="{{$cart->rowId}}" class="deleteItem">delete</span> 
    </div> 
</div>

來源

2017-04-03 Alexandre

您能否展示您的HTML結構？ – 4castle

是的，我更新了帖子，謝謝:) – Alexandre

而不是你在做什麼（2個裝訂處理一個停止傳播），只要綁定一個處理程序，並檢查是否事件的靶子類.cart塊

因此，像這樣：

$('html').click(function(event) { 
    if (!$(event.target).hasClass('cart-block')) 
     $('.cart-block').css('display','none'); 
});

並刪除以下部分

$('.mycart, .cart-block').click(function(event){ 
    event.stopPropagation(); 
});

你的事件現在會正確的傳播以及「顯示：無;」不會被添加到購物車塊，如果你車塊元素內點擊

編輯：如果最類名爲「mycart」，你可以嘗試或者像這樣：

$('html').click(function(event) { 
    if (!($(event.target).closest('.mycart').length)) 
     $('.cart-block').css('display','none'); 
});

什麼這將做的是檢查您的點擊的目標元素是否具有類'mycart'的父級。此解決方案假定無論您在購物車內點擊的是何種類型的「mycart」容器。顯然，沒有看到你的DOM，我不能確定這將解決你的具體情況。如果它與我所設想的不同，至少應該指向正確的方向。

來源

2017-04-03 09:51:04

感謝您的回答，但它不起作用，因爲如果您在其他課程中點擊購物車內部，它會關閉購物車。 – Alexandre

看我的編輯。只要你總是點擊'mycart'的一個孩子（這意味着所有的可點擊區域實際上是'mycart'容器的一個孩子），這將適用於任何事情。如果你有一些可以直接點擊的'mycart'部分（即點擊它們時，事件目標是'mycart'而不是'mycart'的子項，那麼你必須添加'或'在if語句中處理 –

非常感謝！它的工作原理:) – Alexandre

事件停止與兒童事件傳播問題

回答

相關問題