прочитать значение первого столбца из строки

Question

У меня есть таблица, как показано ниже.После нажатия на редактирование я хочу получить значение первого TD, т.е. дату, как я могу это сделать, даже со второй строкой?

    <table id="foo" border="1px">
<tr> 
                    <td rowspan='3' id="date"> 
                     Monday5                   </td> 
                    <td id="Name"> 
                     Jim 
                    <a href="#" class="edit"> 
                      edit 
                     </a> 

                    </td> 
  </tr> 

   <tr> 
                    <td id="Name"> 
                      Remy 
                    <a href="#" class="edit"> 
                      edit</a> 
                    </td> 
  </tr> 


</table>

Answer 1

Прежде всего вы должны исправить свой HTML-код, так как атрибут id уникален.Я предлагаю вам использовать атрибут класса:

<table id="foo" border="1">
    <tr> 
        <td rowspan="3" class="date">Monday</td> 
        <td>Cell A1 <a href="#" class="edit">edit</a></td> 
    </tr>
    <tr> 
        <td>Cell A2 <a href="#" class="edit">edit</a></td> 
    </tr>
    <tr> 
        <td>Cell A3 <a href="#" class="edit">edit</a></td> 
    </tr>
    <tr> 
        <td rowspan="3" class="date">Tuesday</td> 
        <td>Cell B1 <a href="#" class="edit">edit</a></td> 
    </tr>
    <tr> 
        <td>Cell B2 <a href="#" class="edit">edit</a></td> 
    </tr>
    <tr> 
        <td>Cell B3 <a href="#" class="edit">edit</a></td> 
    </tr>
</table>

в коде javascript. Сначала я проверяю, есть ли дата в текущей строке, если нет, получаю первое пред.строка, содержащая дату:

$("#foo a.edit").click(function(e){

    var tr = $(this).closest("tr"),
        date = tr.find("td.date");
    if (date.length == 0) {
        date = tr.prevAll(":has(td.date):first").find("td.date");
    }

    e.preventDefault();
    alert(date.html());
});

см. рабочую демонстрацию по адресу: http://jsfiddle.net/roberkules/WwZPY/

sidenote: я заметил, что вы использовали прописные и строчные имена для классов.Я предлагаю быть более последовательным и называть их всегда прописными или строчными буквами.и классы css чувствительны к регистру, поэтому для устранения другого источника ошибок будьте последовательны.

Answer 2

Если я вас правильно понял, вот как вы можете это сделать

$('a').click(function(e) {
    e.preventDefault;
    var tr = $(this).parents('tr').eq(0);
    while (tr && !tr.find('td:first[rowspan]').length > 0) {
        tr = tr.prev();
    }
    alert(tr.find('td:first').text());
})

И пример на jsfiddle: http://jsfiddle.net/yUpTV/1/

Answer 3

Спасибо за -1 :) Этот работает как надо.

$(".edit").click(function(e){

    var parent_tr = $(this).parents("tr:first");
    var child_rowspan = parent_tr.find("td[rowspan]");


    if (child_rowspan.length == 0) {
        name = parent_tr.prevAll("tr:has(td[rowspan]):first").find("td[rowspan]").text();

    } else {
        name = child_rowspan.text()
    }

    alert(name);
});

Answer 4

Поскольку элемент уже идентифицирован, вы можете получить к нему доступ, например:

$("#date").text();

Answer 5

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

$(this).parents("tr").children("td:first").text()