Jquery - получить значение первого тд в таблице - PullRequest
27 голосов
/ 28 мая 2010

Я пытаюсь получить значение первого тд в каждом тр, когда пользователь нажимает «клик».

Приведенный ниже результат выдаст aa, ee или ii. Я думал об использовании closest ('tr') .. но он всегда выводил "Object object". Не уверен, что делать с этим.

Мой HTML

 <table>
   <tr>
      <td>aa</td>
      <td>bb</td>
      <td>cc</td>
      <td>dd</td>
      <td><a href="#" class="hit">click</a></td>
   </tr>
   <tr>
      <td>ee</td>
      <td>ff</td>
      <td>gg</td>
      <td>hh</td>
      <td><a href="#" class="hit">click</a></td>
   </tr>
   <tr>
      <td>ii</td>
      <td>jj</td>
      <td>kk</td>
      <td>ll</td>
      <td><a href="#" class="hit">click</a></td>
   </tr>
</table>

Jquery

$(".hit").click(function(){

 var value=$(this).// not sure what to do here

 alert(value)  ;

});

Ответы [ 6 ]

60 голосов
/ 28 мая 2010
$(this).parent().siblings(":first").text()

parent дает вам <td> вокруг ссылки,

siblings дает все <td> теги в этом <tr>,

:first дает первый соответствующий элемент в наборе.

text() дает содержимое тега.

39 голосов
/ 28 мая 2010

Это должно работать:

$(".hit").click(function(){    
   var value=$(this).closest('tr').children('td:first').text();
   alert(value);    
});

Пояснение:

  • .closest('tr') получает ближайшего предка, который является элементом <tr> (поэтому в данном случае строка, в которой находится элемент <a>).
  • .children('td:first') получает все дочерние элементы этого элемента, но с помощью селектора :first мы уменьшаем его до первого <td> элемента.
  • .text() получает текст внутри элемента

Как видно из других ответов, для этого есть более чем один способ.

11 голосов
/ 28 мая 2010

В конкретном случае выше, вы могли бы делать жонглирование родителей / детей.

$(this).parents("tr").children("td:first").text()
4 голосов
/ 28 мая 2010
$(".hit").click(function(){
   var values = [];
   var table = $(this).closest("table");
   table.find("tr").each(function() {
      values.push($(this).find("td:first").html());
   });

   alert(values);    
});

Вам следует избегать $(".hit") это действительно неэффективно. Попробуйте вместо этого использовать делегирование событий.

3 голосов
/ 28 мая 2010

Установите firebug и используйте console.log вместо alert. Тогда вы увидите точный элемент вашего доступа.

2 голосов
/ 05 декабря 2013

Если вам нужно получить все td внутри tr без определения идентификатора для них, вы можете использовать код ниже:

var items = new Array();

$('#TABLE_ID td:nth-child(1)').each(function () {
      items.push($(this).html());
});

Приведенный выше код добавит все первые ячейки внутри таблицы в переменную Array.

Вы можете изменить nth-child (1) , что означает первую ячейку для любого нужного номера ячейки.

надеюсь, что этот код поможет вам.

...