#jquery
#jquery
Вопрос:
У меня есть таблица HTML, и мне нужно получить параметр ячейки, на которую я нажимаю, с помощью jQuery. Как мне это сделать?
Мне нужно получить 3-ю строку, 4-й столбец. Вот что у меня есть до сих пор
var tr = $(this).parent();
for (var i = 0; i < tr.children().length; i ) {
if (tr.children().get(i) == this) {
var row = i 1;
break;
}
}
Комментарии:
1. Пожалуйста, не пишите все заглавными буквами. Это затрудняет чтение. Спасибо! Кроме того, ваша проблема, по-видимому, решаема путем привязки (или делегирования) обработчика события щелчка к каждой ячейке. Взгляните на документацию jQuery.
Ответ №1:
Вы могли бы сделать:
$('td').click(function(){
var tr = $(this).closest('tr');
var column = $(this).index() 1;
var row = tr.index() 1;
alert("you clicked row:" row " column:" column);
});
скрипка здесь: http://jsfiddle.net/YA6WY /
Комментарии:
1. Обратите внимание, что
index()
получает положение элемента относительно его родительского элемента. Если таблица содержит несколько<tbody>
<thead>
элементов или,index()
может не вернуть требуемый результат.
Ответ №2:
Вы можете получить доступ cellIndex
rowIndex
к свойствам and <td>
для and <tr>
соответственно. Очень просто:
$('table').delegate('td', 'click', function (evt) {
var td = evt.target,
row = td.parentNode.rowIndex;
col = td.cellIndex;
alert("Row: " row ", Column: " col);
});
Рабочая демонстрация: http://jsfiddle.net/AndyE/T4u93 /
Использование delegate()
для привязки вашего обработчика событий повышает производительность, добавляя к <table>
элементу одно событие, которое фиксирует все щелчки по ячейкам. event.target
выдает нам элемент, который сгенерировал щелчок ( <td>
в данном случае элемент).
- Свойство RowIndex, уровень DOM 1 — w3.org
- Свойство cellIndex, уровень DOM 1 — w3.org