如何訪問jQuery .on（）的「第一個」選擇器？

我想要，具有此腳本：如何訪問jQuery .on（）的「第一個」選擇器？

$('[data-foo]').on('click', '.button-action', function() { 
    // Show alert on $('.button-action', this). 
    // Alert message: Lorem ipsum {$('.foo-id', this).text()} 
});

而且我有多個元素這樣的，動態生成的：

<div data-foo="{id}> 
    <div class="foo-id"> 
     Lorem Value 
    </div> 
    <button class="button-action">Click to show the id of this data-foo</button> 
</div>

換句話說，我想訪問$('[data-foo]')this按鈕我點擊。

來源

2016-08-19 Mithc

它們是如何生成的？你可能會添加一個'id'到每個按鈕，這將徹底解決這個問題？ –

它們是用一個隨機的'data-foo'值和'Lorem Value'生成的，我想要的只是一個通用的'ID'，在這種情況下是'data-foo'並且基於該ID，瞄準事件。 – Mithc

您可以使用event.delegateTarget訪問處理程序連接到（[data-foo]在這種情況下）的元素：

$('[data-foo]').on('click', '.button-action', function(event) { 
    console.log($(event.delegateTarget).find('.foo-id').text()); 
});

但是，如果你總是希望得到foo-id它總是在前面的兄弟姐妹，你可以只使用.prev()還有：

console.log($(this).prev().text());

來源

2016-08-19 21:47:06

太棒了！這工作完美。謝謝，菲利克斯。並感謝大家的幫助:) – Mithc

只需使用$(this).parent()：

$('[data-foo]').on('click', '.button-action', function() { 
    console.log($(this).parent()) 
});

來源

2016-08-19 21:47:23

您可以直接把click上的按鈕，並抓住data-foo從那裏：

$('.button-action').on('click', function() { 
    alert($(this).closest("div").data('foo')); 
});

小提琴：JS Fiddle

來源

2016-08-19 21:51:04

如果我理解你的問題正確，你想要得到的始祖[data-foo]點擊按鈕的元素，對吧？然後這應該工作：

$('[data-foo]').on('click', '.button-action', function(ev) { 
    var $dataFoo = $(this).closest('[data-foo]'); 
    alert($dataFoo[0].nodeName); 
});

來源

2016-08-19 21:51:08 Oliver

如何訪問jQuery .on（）的「第一個」選擇器？

回答

相關問題