jQuery получить имя заголовка таблицы щелкнутой ячейки с идентификатором

У меня есть таблица, и в этой таблице у меня есть значения с id="edit". Теперь я хочу получить имя заголовка соответствующего столбца, когда я нажимаю на любую из ячеек. На мой предыдущий вопрос:jQuery получить имя заголовка таблицы щелкнутой ячейки с идентификатором

$('body').on('click', 'td#edit', function() { 
    var th = $('this').closest('th').eq($('th').val()); 
    alert(th);  // returns [object Object] 
    ......................... 
}

Можете ли вы мне помочь?

HTML:

<table id="myTable" class="myTable"> 
<tbody> 
    <tr> 
     <th>Select</th> 
     <th>JobNo</th> 
     <th>Customer</th> 
     <th>JobDate</th> 
     <th>Warranty</th> 
     <th>RepairStatus</th> 
     <th>POP</th> 
     <th>DOA</th> 
     <th>Model</th> 
     <th>SN</th> 
    </tr> 
    <tr> 
     <td class="check"> 
      <input type="checkbox" value="12345"> 
     </td> 
     <td class="edit"> 
      <b>12345</b> 
     </td> 
     <td class="edit">gdsgasdfasfasdfa</td> 
     <td class="edit">2011-01-21</td> 
     <td class="edit">TRUE</td> 
     <td class="edit">RP</td> 
     <td class="edit">FALSE</td> 
     <td class="edit">0</td> 
     <td class="edit">5152342</td> 
     <td class="edit">66665464</td> 
    </tr> 
</tbody>

источник

2013-03-19 vulkoingim

Вы не должны '' values' с идентификатором = edit' идентификатор должен быть уникальным –

Вы используете тот же id несколько раз? Вы написали, что у вас есть значение * s * с 'id =" edit "'. Идентификаторы должны быть уникальными – Vishal

Что такое разметка 'HTML' .. ?? –

Функция closest() петля в предках вверх по DOM дерева и й не родитель тд так ближе не является правильным выбором. Прежде всего, используйте класс, если у вас одинаковый идентификатор для нескольких элементов. Во-вторых, используйте index(), чтобы найти соответствующий thtd. Для того, чтобы назначить id родительской таблице, чтобы сценарий не работал на другом tables/td на странице.

Live Demo

Html

<table id="tbl1" border="1"> 
    <tr> 
     <th>heading 1</th> 
     <th>heading 2</th> 
    </tr> 
    <tr> 
     <td class="edit">row 1, cell 1</td> 
     <td class="edit">row 1, cell 2</td> 
    </tr> 
    <tr> 
     <td class="edit">row 2, cell 1</td> 
     <td class="edit">row 2, cell 2</td> 
    </tr> 
</table>

Javascript

$('#tbl1').on('click', '.edit', function() { 
    var th = $('#tbl1 th').eq($(this).index()); 
    alert(th.text()); // returns text of respective header 
});

источник

2013-03-19 08:57:12 Adil

Это работает, но возвращает неправильный заголовок и всегда тот же. Я обновляю свой вопрос с помощью разметки HTML. – vulkoingim

Проверьте обновленный ответ. – Adil

Это работает. Но я хочу приставать к вам еще одним дополнением :) Поскольку таблица загружена с помощью Ajax, мне нужно '$ ('body'). On ('click', '.edit', function() {' для регистрации событий правильно, когда я помещаю ваш код внутри этой функции, он каждый раз меняет +1. Поэтому, когда я нажимаю первый раз, я получаю «JobNo», второй раз я получаю «JobNo \ n JobNo» и т. д .... как я могу Исправьте это? – vulkoingim

Для этой разметке

<table> 
    <tr class="header"> 
     <th>Header One</th> 
     <th>Header Two</th> 
     <th>Header Three</th> 
    </tr> 
    <tr> 
     <td class="edit">One</td> 
     <td class="edit">Two</td> 
     <td class="edit">Three</td> 
    </tr> 
    <tr> 
     <td class="edit">One</td> 
     <td class="edit">Two</td> 
     <td class="edit">Three</td> 
    </tr> 
</table>

Вы можете использовать этот код JQuery:

$(".mytable").on('click', 'td.edit', function(e) { 
    var index = $(this).index(); 
    var table = $(this).closest('table'); 
    console.log(table.find('.header th').eq(index).text()); // returns the header text 
});

скрипку здесь: http://jsfiddle.net/7qXm8/

источник

2013-03-19 09:10:35 Vishal

jQuery получить имя заголовка таблицы щелкнутой ячейки с идентификатором

ответ

Смежные вопросы