Автор Тема: Использовать Event для выделения ячейки  (Прочитано 6620 раз)

0 Пользователей и 1 Гость просматривают эту тему.

Оффлайн Night_Wolf

  • Заглянувший
  • Новичок
  • *
  • Сообщений: 29
  • +0/-0
  • 0
    • Просмотр профиля
    • http://
Здравствуйте, запутался совсем... Нужно подсвечивать ячейку, при наведении на нее курсора мыши. Количество строк в таблице заранее не известно.









1
2
3
4
5


Подскажите, чего не так копаю.

Оффлайн hanslinger

  • H2Oer
  • Ветеран
  • *****
  • Сообщений: 1148
  • +0/-0
  • 2
    • Просмотр профиля
    • http://www.orava.ru
Использовать Event для выделения ячейки
« Ответ #1 : 02 Августа 2007, 18:32:38 »
id — он на то и id, чтобы быть уникальным
надо делать id у таблицы, потом бегать по getElementsByTagName(\'tr\') и уже им присваивать события

Оффлайн Night_Wolf

  • Заглянувший
  • Новичок
  • *
  • Сообщений: 29
  • +0/-0
  • 0
    • Просмотр профиля
    • http://
Использовать Event для выделения ячейки
« Ответ #2 : 02 Августа 2007, 18:40:40 »
Если прописать getElementsByTagName(\'tr\'), то туда попадут строки с других таблиц.
Но вопрос еще в том, как инициализировать функцию, которая бы изменяла фон ячеек?

Оффлайн CGVictor

  • теперь местный
  • Глобальный модератор
  • Ветеран
  • *****
  • Сообщений: 2511
  • +0/-0
  • 2
    • Просмотр профиля
    • http://cg.net.ru
Использовать Event для выделения ячейки
« Ответ #3 : 02 Августа 2007, 21:23:58 »
Night_Wolf
Если переделывать этот вариант - то можно выбирать по ClassName.
Вот тут я решения приводил уже: http://forums.webscript.ru/showthread.php?s=&postid=150283#post150283
LJ: Backslashed life (rss)

Оффлайн Night_Wolf

  • Заглянувший
  • Новичок
  • *
  • Сообщений: 29
  • +0/-0
  • 0
    • Просмотр профиля
    • http://
Использовать Event для выделения ячейки
« Ответ #4 : 03 Августа 2007, 12:01:34 »
CGVictor, спасибо большущее! Направил на пусть истинный:) Думаю дальше сам разберусь!

Оффлайн hanslinger

  • H2Oer
  • Ветеран
  • *****
  • Сообщений: 1148
  • +0/-0
  • 2
    • Просмотр профиля
    • http://www.orava.ru
Использовать Event для выделения ячейки
« Ответ #5 : 03 Августа 2007, 15:27:14 »
Цитировать
Если прописать getElementsByTagName(\'tr\'), то туда попадут строки с других таблиц.

Ну, если делать document., тогда да.
А если сделать document.getElementById(\'element\').getElementsByTagName(\'tr\'), то будет все в шоколаде.

Оффлайн andymc

  • Фанат форума
  • Старожил
  • ****
  • Сообщений: 400
  • +1/-0
  • 0
    • Просмотр профиля
Использовать Event для выделения ячейки
« Ответ #6 : 04 Августа 2007, 10:08:02 »
Эта задача уже многими была решена...
function zebraTable(id, c1, c2) {
lastColor = \'#FFFFFF\';
function tblColor(e) {
var e = window.event ? window.event : e;
var el1 = window.event ? window.event.srcElement : e.target;
var el = el1.parentNode;
if (el.tagName == \'TD\') {
el = el.parentNode;
}
var c = el.cells;
if (e.type == \'mouseover\') {
lasrColor = el.bgColor;
el.bgColor = c1;
for (var i = 0; i < c.length; i++) {
c[i].bgColor = c1;
}
} else {
if (c2 != \'\' && c2 != null) {
var setColor = c2;
} else {
var setColor = lasrColor;
}
el.bgColor = setColor;
for (var i = 0; i < c.length; i++) {
c[i].bgColor = setColor;
}
}
}
if (c1 == \'\') {
return false
}
var t = document.getElementById(id);
for (var i = 0; i < t.rows.length; i++) {
lastColor = t.rows[i].bgcolor;
list(t.rows[i], \'mouseover\', tblColor)
list(t.rows[i], \'mouseout\', tblColor)
}
}
function list(o, e, a) {
if (o.addEventListener) o.addEventListener(e, a, false);
else if (o.attachEvent) o.attachEvent("on" + e, a); else return null;
}

Оффлайн new_coder

  • Завсегдатай
  • Новичок
  • *
  • Сообщений: 33
  • +0/-0
  • 0
    • Просмотр профиля
    • http://
Использовать Event для выделения ячейки
« Ответ #7 : 22 Августа 2007, 10:55:42 »
а просто прописать CSS стиль к таблице?

Оффлайн andymc

  • Фанат форума
  • Старожил
  • ****
  • Сообщений: 400
  • +1/-0
  • 0
    • Просмотр профиля
Использовать Event для выделения ячейки
« Ответ #8 : 22 Августа 2007, 11:18:50 »
new_coder
IE понимает hover только для ссылок

 

Sitemap 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28