javascript - jQuery 不返回 jquery.closest().text()

Question

目前，我在 jQuery 从最近的 td.index 返回文本时遇到问题。 Heres what I'm working with :

$(document).ready(function() {
    $.getJSON("http://ddragon.leagueoflegends.com/cdn/4.14.2/data/en_US/rune.json", function(response){
        console.log(response.data);
        $.each(response.data, function (index, entry) {
            $('table.runes').append('<tr><td class="index">'
                    +index+ '</td><td class="icon"> \
                    <div style="width:48px;height:48px;background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"> \
                    </div></td><td class="entry-name">'
                    +entry.name+ '</td></tr> \
                    <tr><td></td><td class="entry-desc">'
                    +entry.description+ '</td></tr>'
                );
        });
    });
    jQuery("body").on("click", "td.entry-name", function() {
        var getText = $(this).closest('td.index');
        alert(getText.text());
    });
});

正如您所看到的，该表是使用 JSON/jQuery 生成的，并且有一个类名为 index 的 td，它保存每行的 ID 号。

当点击td.entry-name时，它应该寻找最接近的td.index并返回其中的文本，这是一个ID号，作为警报。由于某种原因，这不起作用。

我想知道通过查看代码是否可以发现问题。

Answer 1

因为td.index是td.entry-name的兄弟，而不是祖先，所以使用.siblings()而不是.closest()

jQuery("body").on("click", "td.entry-name", function() {
    var getText = $(this).siblings('td.index');
    alert(getText.text());
});