Как найти родительский tr td в таблице с помощью jquery?

Я работаю над asp.net mvc 3. У меня есть следующая структура,

<tr data-uid="123">
<td>
<a href="#" id="click">Click Me</a>
</td>
</tr>

Теперь я хочу найти значение атрибута данных тега. Я пробовал, как,

$("a#click").click(function(){
 var i= $(this).parent('td').parent('tr').data('uid');
});

но не работает для меня. пожалуйста, направляйте меня.

Ответ 1

Попробуйте это

$("a#click").click(function(e){
    e.preventDefault();
    var i = $(this).closest('tr').attr('data-uid');
    console.log(i);
    var j = $(this).closest('tr').data('uid');
    console.log(j);
});​

e.preventDefault() предназначен только для предотвращения действия по умолчанию. Вы можете удалить его, если он вам не нужен.

Также убедитесь, что ваш tr заключен в теги таблицы, чтобы он работал.

FIDDLE ЗДЕСЬ

Ответ 2

Ответ

$("a#click").click(function(e){
    e.preventDefault();
    var i = $(this).closest('tr').attr('data-uid');
    console.log(i);
    var j = $(this).closest('tr').data('uid');
    console.log(j);
});

ПРОСМОТР ДЕМО


Как найти ближайшую строку?

Использование .closest():

var $row = $(this).closest("tr");

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

Проверьте этот метод .parent(). Это альтернатива .prev() и .next().

var $row = $(this).parent()             // Moves up from <button> to <td>
                  .parent();            // Moves up from <td> to <tr>

Получить всю ячейку таблицы <td>

var $row = $(this).closest("tr"),       // Finds the closest row <tr> 
    $tds = $row.find("td");             // Finds all children <td> elements

$.each($tds, function() {               // Visits every single <td> element
    console.log($(this).text());        // Prints out the text within the <td>
});

ПРОСМОТР ДЕМО


Получить только конкретный <td>

var $row = $(this).closest("tr"),        // Finds the closest row <tr> 
    $tds = $row.find("td:nth-child(2)"); // Finds the 2nd <td> element

$.each($tds, function() {                // Visits every single <td> element
    console.log($(this).text());         // Prints out the text within the <td>
});

ПРОСМОТР ДЕМО


Полезные методы

  • .closest() - получить первый элемент, который соответствует селектору
  • .parent() - получить родительский элемент каждого элемента в текущем наборе согласованных элементов
  • .parents() - получить предков каждого элемента в текущем наборе согласованных элементов
  • .children() - получить дочерние элементы каждого элемента в наборе согласованных элементов
  • .siblings() - получить братьев и сестер каждого элемента в наборе согласованных элементов
  • .find() - получить потомки каждого элемента в текущем наборе согласованных элементов
  • .next() - получить сразу следующий родственный элемент каждого элемента в наборе согласованных элементов
  • .prev() - получить непосредственно предшествующий родственный элемент каждого элемента в наборе согласованных элементов

Ответ 3

Ваш код должен работать как есть, но вы можете вместо использования нескольких .parent() использовать родителей ('tr'). http://api.jquery.com/parents/

$(function() {
  $("a#click").click(function(){
    var i= $(this).parents('tr').data('uid');
  });​
});

DEMO: http://jsfiddle.net/mchambaud/G5jM8/1/

Ответ 4

Вы пробовали .attr()?

$("a#click").click(function(){
    var i= $(this).parent('td').parent('tr').attr('data-uid');
    console.log( i );
});

Ответ 5

Используйте это:

var i= $(this).parent('td').parent('tr').attr('data-uid');