Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.07.2011, 17:33
Новичок на форуме
Отправить личное сообщение для neweord Посмотреть профиль Найти все сообщения от neweord
 
Регистрация: 16.07.2011
Сообщений: 2

динамический обработчик события
Есть несколько елементов div, содержание и колличество которых генерируется динамически.

Задача состоит в назначении класса div'у при наведении на него курсора и при этом должны обнуляться классы всех остальных дивов.

Моя задумка такая:
после генерации дивов запускается следующая функция
function addevnt() {
	divarr=document.getElementById('cell').getElementsByTagName('div')
	var ce=0
	while (ce<divarr.length) {
		divarr[ce].onmouseover=evnt
		ce++
	}
}

назначающая дивам обработчик события.

Cледующая функция должна заменять класс
function evnt(cln) {
	divarr=document.getElementById('cell').getElementsByTagName('div')
	var ce=0
	while (ce<divarr.length) {
		divarr[ce].className=''
		ce++
	}
	divarr[cln].className='clss'
}

Но этого не происходит, поскольку непонятно, как определить, на какой именно див был наведен курсор.

При назначении обработчика, как я понимаю, нельзя указать статическую переменную индитифицирующую конкретный див.

Есть идеи, как решить такую задачу?
Ответить с цитированием
  #2 (permalink)  
Старый 16.07.2011, 18:01
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

Вам, наверное, такое нужно:

<style>
.active {
 color: red;
 text-decoration: underline;
}
</style>
<script>
function handler(elem) {
 var divs = document.getElementById("container").getElementsByTagName("div");
 for (var i=0; i!=divs.length; ++i)
  divs[i].className='';
 elem.className='active';
};

window.onload= function() {
 var divs = document.getElementById("container").getElementsByTagName("div");
 for (var i=0; i!=divs.length; ++i)
  divs[i].onmouseover=function(elem) {return function(){handler(elem)}}(divs[i]);
};
</script>
<div id="container">
<div>Text 1</div>
<div>Text 2</div>
<div>Text 3</div>
<div>Text 4</div>
</div>


Хотя намного проще так:
<style>
#container div:hover {
 color:red;
 text-decoration: underline;
}
</style>
<div id="container">
<div>Text 1</div>
<div>Text 2</div>
<div>Text 3</div>
<div>Text 4</div>
</div>


Ах да, ie6...
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #3 (permalink)  
Старый 16.07.2011, 19:44
Новичок на форуме
Отправить личное сообщение для neweord Посмотреть профиль Найти все сообщения от neweord
 
Регистрация: 16.07.2011
Сообщений: 2

trikadin, Все работает! Спасибо большое!

Цитата:
Хотя намного проще так:
А вот этот способ не подошел бы, поскольку смысл не только в подсветке.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
обработчик события focus для окна Сергей Д Internet Explorer 4 22.09.2010 17:33
Как "обмануть" обработчик события? itPiligrim Events/DOM/Window 0 13.05.2010 22:55
как узнать имеется ли обработчик события HelpeR Events/DOM/Window 9 17.02.2010 18:20
Обработчик события: как делает jquery? Shasoft jQuery 35 22.04.2009 09:41
отправка файла через обработчик события submit starrich AJAX и COMET 2 13.08.2008 22:29