javascript - .next (".myClass") 不工作 Jquery

Question

我不知道如何访问我想要的值我已经尝试了很多东西，但我不知道如何找到我的值。 这是我的 HTML:

<table class="liste">
    <tbody>
        <tr>
            <th>Actions</th>
            <th>Nom</th>
            <th>Coordonnées</th>
            <th>Diplômes</th>
            <th>Profil associé</th>
        </tr>
        <tr>
            <td class="groupe" colspan="5">2014-2015            
                <button class="copyMails" title="Copier les adresses emails">
                     <img src="/images/picto/action_dupliquer.png" alt="">
                    Copier les adresses emails
                </button>
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" class="lstMails" value="myText">
            </td>
        </tr>
        <tr>
            <th>Actions</th>
            <th>Nom</th>
            <th>Coordonnées</th>
            <th>Diplômes</th>
            <th>Profil associé</th>
        </tr>
        <tr>
            <td class="groupe" colspan="5">2014-2015            
                <button class="copyMails" title="Copier les adresses emails">
                     <img src="/images/picto/action_dupliquer.png" alt="">
                    Copier les adresses emails
                </button>
            </td>
        </tr>
        <tr>
            BLABLABLA
        </tr>
        <tr>
            BLABLABLA
        </tr>
        <tr>
            <td>
                <input type="text" class="lstMails" value="myText2">
            </td>
        </tr>
    </tbody>
</table>

这是我的 JS:

$("body").on('click', ".copyMails", function() {
    console.log($(this).parent().parent().parent().next('.lstMails').val());
});

我已经尝试过与 parent 一起使用 more 和 less 等等。但我不知道该怎么做。 我想在单击 .copyMails 按钮时访问下一个 .lstMails

Answer 1

你应该使用 closest()导航父 tr 然后使用 next()指向下一个 tr 然后你可以使用 find()

使用

$("body").on('click', ".copyMails",function(){
    console.log($(this).closest('tr').next('tr').find('.lstMails').val());
});

更新

$("body").on('click', ".copyMails", function() {
    alert($(this).closest('tr').nextAll('tr:has(.lstMails)').find('.lstMails').val());
});