29.09.2016, 11:05
|
|
Интересующийся
|
|
Регистрация: 13.01.2015
Сообщений: 10
|
|
|
Получить значения строки и столбца таблицы по нажатию
Получить значения строки и столбца таблицы по нажатию.
Есть функция, которая рисует таблицу, до загрузки страницы. При нажатии на ячейке не рабоатывает обработчик, не могу получить
значение столбца и строчки.
<html>
<head>
<script src="jquery-1.11.1.min.js"></script>
<script>
function load()
{
loc="<table border>"
for(i=0;i<3;i++)
{
for(j=0;j<3;j++)
loc+="<td id='man"+i+j+"'> </td>"
loc+="<tr/>"
}
loc+="</table>"
}
$(document).ready(function(){
$("td").click(function()
{
alert('????')
idi=$(this).attr("id")
one=parseInt(idi[3])
two=parseInt(idi[4])
alert('one='+one)
alert('two'+two)
});
})
</script>
</head>
<body onload="load()">
<div id="target">
</div>
</body>
</html>
Если же в лоб нарисовать таблицу в <body></body> все работает не понимаю почему, как исправить.
<html>
<head>
<script src="jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("td").click(function()
{
idi=$(this).attr("id")
one=parseInt(idi[3])
two=parseInt(idi[4])
alert('one='+one)
alert('two'+two)
});
})
</script>
</head>
<body>
<table border width="30%" height="30%" >
<td width="10%" height="10%" id="man00"> </td>
<td width="10%" height="10%" id="man01"> </td>
<td width="10%" height="10%" id="man02"> </td>
<tr/>
<td width="10%" height="10%" id="man10"> </td>
<td width="10%" height="10%" id="man11"> </td>
<td width="10%" height="10%" id="man12"> </td>
<tr/>
<td width="10%" height="10%" id="man20"> </td>
<td width="10%" height="10%" id="man21"> </td>
<td width="10%" height="10%" id="man22"> </td>
</table>
<div id="itog1"></div>
<br/>
<div id="itog2"></div>
<bt/>
<div id="info"></div>
</body>
</html>
|
|
29.09.2016, 11:11
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
|
Сообщение от polin11
|
|
Если же в лоб нарисовать таблицу в <body></body> все работает не понимаю почему
|
Потому, что таблица создается динамически, и на момент определения обработчика ее нет на странице. А во втором случае есть.
Делегируйте обработку ближайшему родителю присутствующему на странице. |
|
29.09.2016, 11:15
|
 |
Тлен
|
|
Регистрация: 02.01.2010
Сообщений: 6,583
|
|
|
Начнём с того, что ты - пиз у вас в коде таблица вообще никак не рисуется, потому остаётся только гадать.
Например $.ready происходит раньше чем window.onload, потому если бы таблица таки рисовалась, то делала бы это она уже после того как обработчики повесились на ничто. Есть подозрение что вам нужно зарихнуть всё в $.ready. По хорошему и таблицу генерировать с помощью jq сразу, раз уж он подключён.
__________________
29375, 35
|
|
29.09.2016, 11:50
|
|
Интересующийся
|
|
Регистрация: 13.01.2015
Сообщений: 10
|
|
Ошибся в коде, конечно же
<html>
<head>
<script src="jquery-1.11.1.min.js"></script>
<script>
function load()
{
loc="<table border>"
for(i=0;i<3;i++)
{
for(j=0;j<3;j++)
loc+="<td id='man"+i+j+"'> </td>"
loc+="<tr/>"
}
loc+="</table>"
document.getElementById('target').innerHTML = loc;
}
$(document).ready(function(){
$("td").click(function()
{
alert('????')
idi=$(this).attr("id")
one=parseInt(idi[3])
two=parseInt(idi[4])
alert('one='+one)
alert('two'+two)
});
})
</script>
</head>
<body onload="load()">
<div id="target">
</div>
</body>
</html>
|
|
29.09.2016, 14:29
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
#as {
border-collapse: separate;
}
#as td {
padding: 8px 15px;
border: 1px solid #ddd;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
var col = 3, row = 3;
$(function() {
var t = $('<table id="as"/>').appendTo('#target')
.on('click', 'td', function() {
alert($(this).text())
});
for(var i=0, el=col*row, tr; i<el; i++) {
if(!(i % col)) tr = $('<tr/>').appendTo(t);
tr.append('<td>' + i + '</td>');
}
});
</script>
</head>
<body>
<div id="target"></div>
</body>
</html>
И подумайте над тем, нужна ли вам такая геморройная идентификация ячеек - man+i+j, да и нужна ли она вообще.
Последний раз редактировалось laimas, 29.09.2016 в 14:51.
|
|
29.09.2016, 18:25
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
laimas, прекращай развешивать ивенты на все ячейки.
Вот есть такой элемент
document.getElementById('target')
надо его запомнить, но прежде определить снаружи функции переменную для него
var tg=null;
Внутри функции
tg=document.getElementById('target');
tg.innerHTML=loc;
А потом, или до того как
tg.addEventListener('click',getCellText);
и
function getCellText(ev){
if(ev.target.nodeName!='TD') return;
var td=ev.target;
}
It's all folks.
Последний раз редактировалось warren buffet, 29.09.2016 в 18:27.
|
|
29.09.2016, 19:28
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
|
warren buffet,
это ты своей бабушке поясни, придурок.
|
|
30.09.2016, 09:55
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
|
Из-за тебя моя бабушка уже фрилансером стала. )))
|
|
30.09.2016, 10:07
|
|
Профессор
|
|
Регистрация: 14.01.2015
Сообщений: 12,990
|
|
warren buffet,
ты тупой себялюбивый засранец. Из всего, что ты на форуме накалякал, 99%, это ничего незначащий словесный понос. Потрудись выяснить, что означает:
$('table').on('click', 'td', function...)
и стоило ли "умничать". Пшел вон, пес смердячий, от тебя дерьмом тянет за версту. Не рисуйся передо мною, для меня ты полный дебил.
|
|
30.09.2016, 11:49
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
|
Ну ладно, забираю наезд. Можешь мне отпостить гифку. Я в вашей жиквери нихера не понимаю.
|
|
|
|
