我不知道如何获得我想要的价值我尝试过很多东西,但我不知道如何找到自己的价值。 这是我的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());
});
我和父母一起尝试过的越来越少等等。但我不知道该怎么做。 当我点击按钮.copyMails
时,我想访问下一个.lstMails答案 0 :(得分:3)
您需要找到下一个tr
兄弟,然后找到其中的lstMails
元素
$("body").on('click', ".copyMails", function() {
$('#log').html($(this).closest('tr').nextAll('tr:has(.lstMails)').first().find('.lstMails').val());
});
&#13;
<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>
&#13;
您的代码获取了所点击按钮的tbody
祖先,然后尝试查找具有类lstMails
的下一个兄弟 - 这不是您所追求的。
答案 1 :(得分:3)
您应该使用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());
});