31.05.2012, 18:35
|
Новичок на форуме
|
|
Регистрация: 31.05.2012
Сообщений: 4
|
|
Динамическая таблица
Data = new Array('a','b','c','d','e');
var Mytable=document.createElement('table');
document.body.appendChild (Mytable);
for (i=0; i<Data.length; i++) {
var newrow=Mytable.insertRow(i);
var newcell = newrow.insertCell(i);
newcell.setAttribute('id', i);
...
... // Задача: прицепить onClick ячейке newcell на обработчик, который пишет в ячейку элемент из массива Data.
}
Народ, помогите, я за 3 дня устал, чесслово. )
|
|
31.05.2012, 19:05
|
|
Аспирант
|
|
Регистрация: 21.05.2012
Сообщений: 89
|
|
попробуйте такой вариант как пример и подгоните под себя
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
data = new Array('a','b','c','d','e');
document.write('<table>');
var a='Онклик повешен';
for (i=0; i<=data.length; i++) {
document.write('<tr><td onclick="alert(a);">1</td></tr>');
}
document.write('</table>');
</script>
</head>
<body>
</body>
</html>
|
|
31.05.2012, 19:36
|
sinistral
|
|
Регистрация: 28.03.2011
Сообщений: 5,418
|
|
Сообщение от mixxer
|
Data = new Array('a','b','c','d','e');
var Mytable=document.createElement('table');
document.body.appendChild (Mytable);
for (i=0; i<Data.length; i++) {
var newrow=Mytable.insertRow(i);
var newcell = newrow.insertCell(i);
newcell.setAttribute('id', i);
...
... // Задача: прицепить onClick ячейке newcell на обработчик, который пишет в ячейку элемент из массива Data.
}
Народ, помогите, я за 3 дня устал, чесслово. )
|
<!DOCTYPE HTML>
<html><head></head>
<body>
<script>
var Data = ["a", "b", "c", "d", "e"];
var myTable = document.createElement("table");
var i;
var newCell;
for(i = 0; i < Data.length; i++) {
newCell = myTable.insertRow(i).insertCell();
newCell.id = "num" + i; // id не должен начинаться с числа
newCell.innerHTML = i;
(function(i){ // это замыкание.
newCell.onclick = function(){ alert(i); };
})(i);
}
document.body.appendChild(myTable);
</script>
</body></html>
|
|
31.05.2012, 19:58
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
<body>
<style>
td {border: solid 1px; width: 20px; height: 20px; text-align: center; background: lightgrey}
</style>
<script>
window.onload = function () {
var data = new Array('a', 'b', 'c', 'd', 'e');
var length = data.length;
var row = '<tr><td></td></tr>';
var str = '';
for (var i = 0; i < length; i++) {
str += row;
}
var myTable = document.createElement('table');
document.body.appendChild (myTable);
myTable.innerHTML = str;
myTable.onclick = function (e) {
e = e || event;
var target = e.target || e.srcElement;
for (var i = 0; i < length; i++) {
if (target.parentNode == myTable.rows[i]) {
target.innerHTML = data[i];
return;
}
}
}
}
</script>
Последний раз редактировалось bes, 31.05.2012 в 20:07.
|
|
31.05.2012, 20:22
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
Не пойму только почему в IE myTable.innerHTML = str; не срабатывает.
|
|
31.05.2012, 20:51
|
sinistral
|
|
Регистрация: 28.03.2011
Сообщений: 5,418
|
|
Сообщение от bes
|
Не пойму только почему в IE myTable.innerHTML = str; не срабатывает.
|
msdn:
Цитата:
|
The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.
|
|
|
31.05.2012, 21:15
|
Новичок на форуме
|
|
Регистрация: 31.05.2012
Сообщений: 4
|
|
Всем спасибо, хоть что-то прояснилось. Дальше думаю разберусь. Видимо надо почитать про замыкания. Ох уж эти языки высокого уровня.
|
|
31.05.2012, 21:46
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
melky, спасибо за пояснение.
|
|
01.06.2012, 14:38
|
Новичок на форуме
|
|
Регистрация: 31.05.2012
Сообщений: 4
|
|
The innerHTML property is read-only on the col, colGroup, frameSet, html, head, style, table, tBody, tFoot, tHead, title, and tr objects.
td здесь не указано.
Наверное, тогда буду удалять и заново вставлять ячейку deleteCell() insertCell(). Теперь хоть всё прояснилось.
Но еще ведь есть слои. Я просто новичок в этом деле. Разберусь.
Спасибо.
Последний раз редактировалось mixxer, 01.06.2012 в 14:50.
|
|
01.06.2012, 15:08
|
|
Просто любитель
|
|
Регистрация: 13.09.2011
Сообщений: 300
|
|
mixxer, а innerText?
|
|
|
|