.next (". myClass") Not Jquery

Question

내가 원하는 값에 액세스하는 방법을 모르겠다. 나는 많은 것을 시도했지만 내 값을 찾는 방법을 모른다.

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

나는에 더 적은 등으로 부모를 시도했다 그러나 나는이 작업을 수행하는 방법을 모르는 여기 내 HTML입니다. 나는 버튼 .copyMails

당신은 다음 tr 형제 다음 lstMails 요소를 찾을 필요가

Answer 1

그런 다음 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

를 클릭하면 다음 .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>

내부에 코드가 tbody 클릭 버튼의 조상을 얻은 다음 클래스 lstMails이있는 다음 형제를 찾으려고합니다.