JQuery вывод текста элементов таблицы
Имеется html таблица. Подскажите, как с помощью JQuery при событии click вывести с помощью alert текст в текущей <td></td> (по которой кликнули) и вывести текст последней братской <td></td>. Тоесть эти две <td></td> расположены в одной <tr></td>. Пытался вывести как-то так
alert($(this).find(':last-of-type').text();
вроде не работает. Спасибо!:( |
javaphp,
макет бы полностью |
javaphp,
<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style>
table{
border: 1px solid black;
border-collapse: collapse;
}
td{
text-align: center;
border: 1px solid black;
width: 30px;
height: 30px;
}
td:hover{
cursor: pointer;
}
</style>
<body>
<table>
<tr class="first">
<td class="cell">1.1</td>
<td class="cell">1.2</td>
<td class="cell">1.3</td>
<td class="cell">1.4</td>
</tr>
<tr class="second">
<td class="cell">2.1</td>
<td class="cell">2.2</td>
<td class="cell">2.3</td>
<td class="cell">2.4</td>
</tr>
<tr class="third">
<td class="cell">3.1</td>
<td class="cell">3.2</td>
<td class="cell">3.3</td>
<td class="cell">3.4</td>
</tr>
</table>
</body>
</html>
<script>
$('.cell').click(function() {
var clicked = event.target.innerHTML;
var row = event.target.parentNode;
var last = row.children[row.children.length-1].innerHTML;
if (clicked != last){
alert("выбранная ячейка = " + clicked + "\nПоследняя ячейка = " + last);
} else {
alert("Вы выбрали последнюю ячейку = " + clicked);
}
});
</script>
Два варианта вывода. Если на последнюю ячейку тыкнули, то выводится одно значение. Без вашего макета тяжело как-то это представить ещё. |
спасибо!
|
| Часовой пояс GMT +3, время: 07:29. |