Получить идентификатор второго элемента

Question

У меня есть структуру таблицы, как этот

<tr> 
<td>Cover Banner</td> 
<td><div id="coverPreview"></div></td> 
<td><input type='file' id="coverBanner"/></td> 
</tr> 

То, что я пытаюсь сделать это, когда я нажимаю на кнопку просмотра файла, я должен получить предыдущий идентификатор, т.е. «coverPreview»

Я сделал, как этот

$(this).closest('tr').children(':first-child').next().attr("id") 

В результате я получаю не определено. Может ли кто-нибудь помочь мне.

Answer 1

Попробуйте получить closest('td') и используя prev() и find() оттуда. Попробуйте это:

var divId = $(this).closest('td').prev().find('div').prop('id'); 

$('input').change(function() { 
 
    var divId = $(this).closest('td').prev().find('div').prop('id'); 
 
    console.log(divId); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>Cover Banner</td> 
 
    <td> 
 
     <div id="coverPreview"></div> 
 
    </td> 
 
    <td> 
 
     <input type="file" id="coverBanner" /> 
 
    </td> 
 
    </tr> 
 
</table>

Answer 2

У вас есть один DIV в тр, так что вы можете найти его с помощью find() внутри родительского элемента.

$(this).closest('tr').find('div').attr('id'); 

Answer 3

$('#coverBanner').click(function() { 
 
    console.log($(this).parent().prev().find('div').attr("id")) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>Cover Banner</td> 
 
    <td> 
 
     <div id="coverPreview"></div> 
 
    </td> 
 
    <td> 
 
     <input type='file' id="coverBanner" /> 
 
    </td> 
 
    </tr> 
 
</table>

Использование .parent(), .prev() и .find()

Answer 4

Простой способ

$("this").parent().siblings().find("div").attr("id"); 

or 

$("this").parent().prev().find("div").attr("id"); 

Answer 5

Попробуйте

$(this).parent().prev().children().attr("id"); 

Подробнее о jQuery Traversing