Javascript+DOM+event

rewue · №1

При написании сайта возникла проблемы такого рода:

При загрузке страницы формируется таблица скриптом и вставляется с помощью метода innerHTML в div. Так вот на двух одинаковых версиях браузера (1,0,7) - работает по разному -на одной машине все нормально работает и табличка формируется, на другой (мне почему то кажется что из-за 2 го сервис пака Винды) - табличка не формируется вообще. Консоль при этом молчит.

Второй глюк - по нажатию на заголовок следующий за ним список должен развернуться или свернуться (в зависимости от флажка). Вопрос каким образом обойти свойство nextSibling. Впрямую адресоваться к списку я немогу - он не всегда отображаеся.

Как обрабатывается событие евент для Файрфокса?

Snik · №2

на одной машине все нормально работает и табличка формируется, на другой (мне почему то кажется что из-за 2 го сервис пака Винды) - табличка не формируется вообще. Консоль при этом молчит.

Если браузер и страница одинаковые, то дело в настройках. Может, на 2-м JavaScript просто отключен?

Второй глюк - по нажатию на заголовок следующий за ним список должен развернуться или свернуться (в зависимости от флажка). Вопрос каким образом обойти свойство nextSibling. Впрямую адресоваться к списку я немогу - он не всегда отображаеся.

Эта, примерчик-бы. А то что-то не пойму, в чем проблема.

Как обрабатывается событие евент для Файрфокса?

http://developer.mozilla.org/en/docs/DOM:event

Unghost · №3

==> Разработка

rewue · №4

2 administrator
Извиняюсь что не туда прицепил...
2 snick
Что касается отображения таблицы - -дело было не в паке винды, просто на одной из машин запускалась неправленая версия... На самом деле не отображается табличка, которая генерится с помощью скрипта ни на одной машине...

Что касается разворачивания. Есть заголовок, который и вызывает эту функцию. По нажатию на него список должен либо свернуться либо развернуться.
вот кусок кода (функция, отвечающая за разворот)

Выделить код

Код:

var flag=true;
function accordeon(el)
{
	if(flag)
	{	
		el.nextSibling.style.display="none";
		flag=false;
	}
	else
	{
		el.nextSibling.style.display="block";
		flag=true;
	}
}

profiT · №5

А зачем нужен флаг? Не проще ли написать:

Выделить код

Код:

function accordeon(el)
{
with (el.nextSibling.style) 
display=(display=="none")?"block":"none";
}

НО!

Очень возможно, что nextSibling'ом у вас не ожидаемый следующий <li>, а узел типа #text (перевод строки, случайный пробели и т.д.). Надо это дело обходить.

Snik · №6

rewue
profiT прально говорит, если откроешь DOM Inspector, то увидишь, что следующим элементом будет не список, а #text. Поэтому:

Выделить код

Код:

function accordeon(el) {
  var NextEl=el.nextSibling;
  while (NextEl.tagName!='UL') NextEl=NextEl.nextSibling;
  with (NextEl.style) display=(display=="none")?"block":"none";
}

rewue · №7

profiT пишет

А зачем нужен флаг? Не проще ли написать:
Выделить код
Код:
function accordeon(el)
{
with (el.nextSibling.style) 
display=(display=="none")?"block":"none";
}
НО!
Очень возможно, что nextSibling'ом у вас не ожидаемый следующий <li>, а узел типа #text (перевод строки, случайный пробели и т.д.). Надо это дело обходить.

Следующий узел точно не текстовый - проверено. Да этих елементов 4 штуки и в одном так и было, но в остальных все нормально...

rewue · №8

Народ, я вот сходил по ссылке, что мне Snik дал и чего то я там не догоняю. Вроде как обработчик написан правильно а ничего не работает...

Вот что мне нужно
Есть заголовок. При клике по нему должна выполняться функция - какая сейчас не важно. Главное что она должна запуститься...

rewue · №9

И вдогонку - а нет ли документации одним файликом? ПДФ или СНМ...

Anton · №10

rewue пишет

...Есть заголовок. При клике по нему должна выполняться функция...

Выделить код

Код:

...
<h1 onclick="rewueTitleClickFunction();">...

?

Snik · №11

rewue

Следующий узел точно не текстовый - проверено. Да этих елементов 4 штуки и в одном так и было, но в остальных все нормально..

Сегодня нет, а завтра - есть. Вдруг строчку перенести захочется? Дополнительную проверку и защиту от дурака в программировании никто не отменял.
Да, если таких заголовков не 1, а много, то рулит такое:

Выделить код

Код:

var tags = document.getElementsByTagName("H1");
for (var i=0; i<tags.length; i++) {
    (tags[i]).onclick=ClickProcessingFunction;
  }
}

rewue · №12

2 Snick
Ну про защиту от дурака я не спорю. В конце концов дописать одну строку несложно.

Блин все заработало... Просто я обозвал дивижн куда вставляю таблицу зарезервированным именем и из-за этого все скрипты перестали работать под Фоксом...
Только вот теперь новая беда - тот дивижн куда вставляю табличку сгенерированную скриптом "плывет" - т.е. не воспринимает CSS разметку. Такая штука бывает иногда при объявленном ДТД - но их я уже поубирал и в Опере и В Експлорере все нормально...

Snik · №13

rewue
Честно говоря, если ошибка убирается при устранении DTD в IE, значит код страницы совсем плох. С DTD IE пытается более-менее как надо страницы строить. А без-совсем уж по-своему. В FF без DTD обработка больше похожа не IE-шную с DTD.

rewue · №14

это не ошибка... Это глюк, просто при включенном ДТД любом - ни один браузер не хочет для абсолютно опзиционированного дивижна использовать свойство height///

rewue · №15

Все проблема решилась и с ДТД... просто надо было правильно написать свойство.

Полезная информация

№121-10-2005 17:47:40