jQuery中的parentOrSelf（[selector]）

我在很多我的JS腳本中使用事件委託。通常，我會做的是我將有一個全局事件處理程序，並且我將追蹤到接收事件的元素。問題是我不能總是在安裝事件時使用jQuery的過濾選擇器。例如，如果你正在使用它：jQuery中的parentOrSelf（[selector]）

$('.todo').on('click', function(e) { 
    // The event target is guaranteed to be something having the 
    // class .todo 
    var todo = e.target; 
});

那麼它是非常簡單的，

不過，我現在在骨幹鑑於事件委派玩，在那裏我可以安裝一個事件處理程序：

'click .todo' : 'someHandlerFunction'

問題在於處理程序函數我不能保證在右邊接收事件目標，但我可以改爲它的後代之一。也就是說，我是獲取事件對象，但它的目標也可以是「.todo」類中某個元素的內部元素，由於冒泡。

理想情況下，我想有一個簡單的功能，將做到這一點：

$(document.body).on('click', function(evt) { 
    var interestingElementOrNull = jQuery(evt.target).parentOrSelf('.todo'); 
});

，但我不得不訴諸於事件目標首先做一個hasClass()，然後（如果它不匹配）待辦事項parent()致電。

有沒有更好的/標準的方法來做到這一點？

來源

2013-03-19 Julik

難道你不能只使用最接近的（）來獲得父母或自我？它首先檢查當前元素，然後在樹中向上查找匹配。或者你只想要升一級？ – 2013-03-19 19:32:53

由於wirey說，如果你想ancestorOrSelf()而不是parentOrSelf()，你只需要使用closest() ：

var element = jQuery(evt.target).closest(".todo");

如果你真的想parentOrSelf()，您可以鏈接到parent()addBack()^*和應用filter()的結果：

var element = jQuery(evt.target).parent().addBack().filter(".todo");

但是請注意，在這兩種情況下，element將是，如果沒有匹配的空jQuery對象，而不是null。如果您想確定是否匹配，您可以測試其length屬性。

_{* addBack()在jQuery 1.8之前被命名爲andSelf()。}

來源

2013-03-19 19:37:34

是的，我想要的確實是'ancestorOrSelf（）'，所以'最接近（）'是我正在尋找的。在其他消息中，如果我確實在事件表中指定了一個選擇器，Backbone應該可以對我進行過濾...... – Julik 2013-03-19 20:16:16

您可以編寫自己的插件，如果你不希望每次都手動檢查活動對象：

$.fn.parentOrSelf = function(selector){ 
    return this.is(selector) ? this : this.closest(selector); 
}

來源

2013-03-19 19:37:20

'nearest（）'在搜索中包含'this'，所以你可以直接調用它。（然後，如果在包含多個元素的jQuery對象上調用，則方法的語義與'nearest（）'有區別。） – 2013-03-19 19:43:47

jQuery中的parentOrSelf（[selector]）

回答

相關問題