Текст первой td при клике по кнопке в третьем td вставить в определенный блок
Есть таблица
<table class="text_tab"> <tbody> <tr class="t1"> <td data-title="Значение атрибута 1">Этот текст НЕ надо вставить</td> <td data-title="Значение атрибута 2"><div class="class0">Тест</div></td> <td><div class="slass1"><a class="class2" href="#">Кнопка - ссылки для перехода</a></div></td> </tr> <tr class="t0"> <td data-title="Значение атрибута 1">Этот текст надо вставить</td> <td data-title="Значение атрибута 2"><div class="class0">Тест</div></td> <td><div class="slass1"><a class="class2" data-target="#exampleModal" data-toggle="modal">Кнопка модал окна</a></div></td> </tr> <tr class="t1"> <td data-title="Значение атрибута 1">Этот текст надо вставить</td> <td data-title="Значение атрибута 2"><div class="class0">Тест</div></td> <td><div class="slass1"><a class="class2" data-target="#exampleModal" data-toggle="modal">Кнопка модал окна</a></div></td> </tr> </tbody> </table> При клике по кнопке открывается модальное окно и нужно текст из первой ячейки (первого td) этой же строки (tr) вставить в блок в модальном окне <div class="class3"></div> У меня получилось лишь сделать при клике по строке, а нужно именно при клике по кнопке в этой строке, которая открывает модальное окно
$('tr.t1,tr.t0').on('click', function(){
var u = $('td:first-child', this).text();
$(".class3").html(u);
console.log(u);
});
|
$('.text_tab').on('click', 'a[data-toggle]', function() {
$(this).closest('td').siblings() //это будут ячейки из которых нужно взять текст куда-то
})
|
Цитата:
Благодарю, попробую этот вариант. У меня так получилось:
$(".slass1 [data-toggle=modal]").click(function() {
var u = $(this).closest('tr').children('td:first-child').text();
$(".class3").html(u);
console.log(u);
});
|
Цитата:
|
:)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$('tr').on('click', 'a[data-toggle]', function(event) {
var txt = event.delegateTarget.cells[0].textContent;
alert(txt);
})
});
</script>
</head>
<body>
<table class="text_tab">
<tbody>
<tr class="t1">
<td data-title="Значение атрибута 1">Этот текст НЕ надо вставить</td>
<td data-title="Значение атрибута 2"><div class="class0">Тест</div></td>
<td><div class="slass1"><a class="class2" href="#">Кнопка - ссылки для перехода</a></div></td>
</tr>
<tr class="t0">
<td data-title="Значение атрибута 1">Этот текст надо вставить</td>
<td data-title="Значение атрибута 2"><div class="class0">Тест</div></td>
<td><div class="slass1"><a class="class2" data-target="#exampleModal" data-toggle="modal">Кнопка модал окна</a></div></td>
</tr>
<tr class="t1">
<td data-title="Значение атрибута 1">Этот текст надо вставить</td>
<td data-title="Значение атрибута 2"><div class="class0">Тест</div></td>
<td><div class="slass1"><a class="class2" data-target="#exampleModal" data-toggle="modal">Кнопка модал окна</a></div></td>
</tr>
</tbody>
</table>
</body>
</html>
|
Цитата:
|
Цитата:
|
Ооо сколько вариантов, глаза разбегаются...
Благодарю laimas и рони, всегда помогаете... |
| Часовой пояс GMT +3, время: 22:01. |