.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()); 
}); 

我已經和與多與少等，家長試過，但我不知道如何做到這一點。 我想進入下一個.lstMails當我點擊按鈕.copyMails

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()); 
}); 

Answer 2

你需要找到下一個tr兄弟，然後lstMails元素裏面

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<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> 
 
     <td>BLABLABLA</td> 
 
    </tr> 
 
    <tr> 
 
     <td>BLABLABLA</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="text" class="lstMails" value="myText2"> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<div id="log"></div>

你代碼獲得點擊按鈕的祖先，然後嘗試找到類lstMails的下一個兄弟姐妹 - 這不是你在做什麼。