event.cancelBubble不適用於.live

我想在所有record_row div onclick的基礎上執行一項操作。我正在通過$('.record_row').live("click",function(){})來做這件事。裏面record_row div我把option_icon div其中我已經把圖像。我已經阻止了onclick="event.cancelBubble = true;"的onclick記錄。它正在罰款$('.option_icon').click(function(){})但不能與$('.option_icon').live("click",function(){})功能。event.cancelBubble不適用於.live

有什麼建議嗎？提前致謝。

HTML： -

<div id="container"> 
    <ul> 
     <li><div id="data_item_1" class="record_row"> 
       User record displayning here 
       <div class="option_icon" onclick="event.cancelBubble = true;"> 
        ----- 
       </div> 
      </div> 
     </li> 
     <li> 
      <div id="data_item_2" class="record_row"> 
       ......... 
       <div class="option_icon" onclick="event.cancelBubble = true;"> 
        ----- 
       </div> 

      </div> 
     </li> 
    </ul> 
</div>

jQuery的： -

$('.record_row').live("click",function(){ 
    ----------- 
    ----------- 
    // working fine 
}); 

$('.option_icon').live("click",function(e){ 
     e.stopPropagation(); 
    ----------- 
    ----------- 
    // Not working 
});

來源

2013-02-06 Roopendra

[生活（）]（http://api.jquery.com/刪除onclick事件處理程序live /）已被棄用，您應該使用替代方法，但即使如此，正如文檔所述，*在事件處理函數中調用event.stopPropagation（）對於停止附加在文檔中較低位置的事件處理函數是無效的;該事件已經傳播到文檔*（將'cancelBubble'設置爲'true'相當於調用'stopPropagation（）'）。 –

'event.cancelBubble'是IE如何停止事件傳播，jQuery統一接口並提供'event.stopPropagation（）'。 –

此外，'onclick'和所有其他內聯事件處理程序都皺起了眉頭。不要這樣做。你**從來沒有**需要混合JS代碼和HTML，尤其是*因爲你有jQuery。 – Tomalak

我想嘗試處理這樣的單擊事件：

$(document).on('click', '.option_icon', function(ev){ 
    ev.stopPropagation(); 
    ev.cancelBubble = true; 

    ----------- 
    ----------- 
    // Not working 
});

你可以找到更多有關此信息here

來源

2013-02-06 14:35:43 davids

它不適用於我的情況下加載Ajax內容 – Roopendra

因此，正如@FrédéricHamidi建議，你應該嘗試'on'方法，而不是'live'，因爲它已被棄用（請參閱編輯的答案） – davids

對於您的第一個處理程序，請使用jQuery事件對象的target屬性檢查事件發生的位置。由於它也可能起源於div.option_icon的孩子，因此可以使用closest方法確定它是否在<div>之內。

$('#container').on('click', '.record_row', function (e) { 

    // if event bubbled up from .option_icon, ignore 
    if ($(e.target).closest('.option_icon').length > 0) return; 

    //your code here... 

});

你的第二個處理程序，簡直是

此外，從你的HTML標記

來源

2013-02-06 14:54:11 nbrooks

event.cancelBubble不適用於.live

回答

相關問題