Получить родителя td и tr ребенка

Question

Мне нужно получить значение «TEST1» от первого TD, нажав на кнопку. Я пробовал javascript, но он не работает. Печать дала мне неопределенное.

<table style="width:100%"> 
     <tr> 
      <td>TEST1</td> 
      <td>TEST2</td> 
      <td><button class='x' type='button' onclick='openindex()' >value='button'</button></td> 
     </tr> 
    </table> 

Вот моя функция Javascript, я не могу понять, что я делаю неправильно, потому что я найти ближайший Tr, но свойство ребенка не работает

function openindex(){ 
    var $row = $(this).closest("tr"); 
     $tds = $row.find("td:nth-child(1)").value; 
alert($tds); 
} 

Answer 1

Вы звоните openindex() без явного контекста, так что this (внутри него) будет window, а не элементом.

Вы могли бы передать его:

onclick="openindex.call(this)" 

но вы должны избегать использования onclick атрибутов в первую очередь и связать свои функции с jQuery().on вместо этого.

jQuery('button').on('click', openindex); 

Answer 2

Я думаю, вам просто нужно использовать

$tds = $row.find("td:nth-child(1)").text(); 

вместо

$tds = $row.find("td:nth-child(1)").value; 

Вы должны также использовать УАК ключевое слово, чтобы установить переменную, так что не является глобальной переменной и так он просто возвращает строку, нет необходимости в $ so

var tds = $row.find("td:nth-child(1)").text(); 

Или другой способ вообще бы

$('.x').click(function() { 
    var $row = $(this).closest("tr"); 
    var tds = $row.find('td').first().text(); 
    alert(tds); 
})