Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.05.2012, 18:35
Новичок на форуме
Отправить личное сообщение для mixxer Посмотреть профиль Найти все сообщения от mixxer
 
Регистрация: 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 дня устал, чесслово. )
Ответить с цитированием
  #2 (permalink)  
Старый 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>
Ответить с цитированием
  #3 (permalink)  
Старый 31.05.2012, 19:36
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 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>
Ответить с цитированием
  #4 (permalink)  
Старый 31.05.2012, 19:58
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 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.
Ответить с цитированием
  #5 (permalink)  
Старый 31.05.2012, 20:22
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Не пойму только почему в IE myTable.innerHTML = str; не срабатывает.
Ответить с цитированием
  #6 (permalink)  
Старый 31.05.2012, 20:51
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 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.
Ответить с цитированием
  #7 (permalink)  
Старый 31.05.2012, 21:15
Новичок на форуме
Отправить личное сообщение для mixxer Посмотреть профиль Найти все сообщения от mixxer
 
Регистрация: 31.05.2012
Сообщений: 4

Всем спасибо, хоть что-то прояснилось. Дальше думаю разберусь. Видимо надо почитать про замыкания. Ох уж эти языки высокого уровня.
Ответить с цитированием
  #8 (permalink)  
Старый 31.05.2012, 21:46
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

melky, спасибо за пояснение.
Ответить с цитированием
  #9 (permalink)  
Старый 01.06.2012, 14:38
Новичок на форуме
Отправить личное сообщение для mixxer Посмотреть профиль Найти все сообщения от mixxer
 
Регистрация: 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.
Ответить с цитированием
  #10 (permalink)  
Старый 01.06.2012, 15:08
Аватар для GuardCat
Просто любитель
Отправить личное сообщение для GuardCat Посмотреть профиль Найти все сообщения от GuardCat
 
Регистрация: 13.09.2011
Сообщений: 300

mixxer, а innerText?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамическая таблица magicpro Элементы интерфейса 3 15.08.2011 09:47
Динамическая таблица Igor Shmigoff Элементы интерфейса 1 31.05.2011 02:43
динамическая подгрузка css в head. socengel AJAX и COMET 10 23.03.2011 17:43
Динамическая таблица результатов Anutik_pk Я не знаю javascript 0 29.05.2009 01:02
Изменение цвета ячейки (динамическая таблица) не по событию ImSWORDMASTER Элементы интерфейса 3 12.03.2009 21:21