如果我只知道父元素的類或ID，如何在子textarea上設置模糊偵聽器？

Question

我的Chrome擴展程序需要監聽特定TEXTAREA上的模糊事件。 textarea的類和ID由父頁面動態設置...因此我無法使用它們的詳細信息來觸發我的內容腳本代碼。

textarea在div內部，但是確實有一個固定的類，我可以在此元素上使用blur事件監聽器。 但是，div包含其他元素，如果僅在父div上聽模糊處理，我將無法可靠地知道用戶何時移出特定文本區域。 如何在子文本區域上聽模糊？

這是一些示例代碼：

<div class="parentDIV">
    <input id="checkbox_gidix87dxx">
    <textarea id=textarea_90d9x9ddas">
</div>

如果我在parentDIV類上設置了focusin事件，則可以獲取動態創建的textarea的ID，如下所示：

var ffTextAreaObj = $('.parentDIV').find('textarea');
console.log('Trying for textarea Obj1: ', ffTextAreaObj);
var ffTextAreaID = ffTextAreaObj[0].id;

在focusin偵聽器中，我嘗試創建一個動態偵聽器...但是它不會觸發。

$('#' + ffTextAreaID).blur(function(){
    //Do something
});

任何幫助/方向深表感謝！

Answer 1

如何在子文本區域上聽模糊？

您可以通過在父級上設置模糊處理程序來捕獲對子級文本區域的更改。 jQuery的.on()的第二個參數可以是充當過濾器的選擇器，因此您的處理程序將僅偵聽與過濾器匹配的子元素觸發的事件。

回調函數將接收一個事件對象，您可以使用該對象的.target屬性獲取觸發該事件的textarea元素。

$(function () {
    $('.parentDIV').on('blur', 'textarea', function(evt) {
        console.log(evt.target);
    });
});

Answer 2

您會反對一些香草味嗎？ ;-） 嘗試這個：

 $('.parentDIV textarea')[0].addEventListener("blur", function(e){ console.log("Blur has been caught. Blur event: "); console.dir(e); }); 

它行得通嗎？