HTML > DOM > JavaScript > IE > БЪГОВЕ, Бъгове и бъгове ...

Автор

Съобщение

stambentseto
Вто, 30.03.10, 15:00

Здравейте програмисти и УЕБ дизайнери.
Допитвам се до вас по следния въпрос: Може ли или не може да се създават динамично DOM бутони (BUTTON) със задаване на няколко 'Ивент-а' (onClick, OnMouseOver, OnMouseOut), но БЕЗ за се създава отделна функция за всеки отделен ивент?
ЗАЩО ми трябва това:
Бутоните които ще създавам се генерират от масив, който с течение на времето ще увеличава големината си т.е. след време, вероятно ще е адски голям. В особеностите на DOM подобни ивенти се създават чрез (в IЕ)
.attachEvent('event', function);
ОБАЧЕ именно function ми е проблем. Ако имам 100 бутона - как по дяволите да напиша за всеки един поотделно функция. А ако има и повече от един ивент? И по-лошо - много от функциите биха били еднотипни.
Примерно: За момента си прилагам следните ивенти за всеки един бутон:
onMouseOver= "this.style.color = 'red'" onMouseOut="this.style.color = 'black'"
като напиша обаче:
attachEvent('onмouseоver', this.style.color = 'red')
и всичко отива по дяволите...
След доста експерименти ОСВЕН че 'event'-а трябва да е само с малки букви, открих, че 'function' не възприема и параметри. т.е. следното също не ми върши работа:
attachEvent('onмouseоver', function(param1, param2))
ИЛИ поне при IE 6 не сработва .
И понеже МНОГО ме мързи да си блъскам главата за глупости - Ето и моментното решение, което засега върши работа:
element.setAttribute("onClick", 'reagirai()'); // основната работна функция element.setAttribute("onMouseOver", "this.style.color = 'red'"); // визуални шарении element.setAttribute("onMouseOut", "this.style.color = 'black'"); AddtoDIV(foo,element); // създаване на елемента
Така си зареждам 'ивентите' като 'атрибути'. НО /адски голямо НО/ и това излиза, че е неприложимо, без следния 'Туик':
function AddtoDIV(kade,kakvo){ //Append the element in page (in DIV). kade.appendChild(kakvo); kade.innerHTML += '<br>'; // -IE tweak for evading crappy set attributes }
Цялата работа е в .innerHTML, чрез което се излиза от DOM и се преминава към HTML съдържание. Без него ивентите не се активират и си остават безполезни атрибути.
Същото това <BR> обаче ми се бърка в подредбата на съдържанието, и макар не е фатално, ми се ще да се избегне.
И така! Предложения ?
Отговор За печат
angelicstar
Вто, 30.03.10, 15:24

Ами тъпото е, че ІЕ не се оправя с разширяеми масиви /vectors/ в JS.
Сещам се 1 начин ама е гаден. Да направиш всичко на Java като аплет. Там може на всеки елемент във вектора да присвоиш колко ти са кеф ивенти. Ако ще и вектор с вектори от ивенти.
Ама и така няма да стане много динамично. При всяка промяна в ивентите трябва аплетът да се презарежда.
Отговор За печат
insecteater
Вто, 30.03.10, 16:49

Карам по смътни спомени, но няма ли начин да ползваш "this" в тялото на функцията, за да се обръщаш към "собственика" и? Би трябвало да ти свърши работа.
Отговор За печат
phrozencrew
Вто, 30.03.10, 17:02

Я нарисувай концепцията с два бутона, че нещо не схванах идеята. И защо не използваш линкове с class="neshto_si" и да премахнеш поне 2 от събитията с мишката a, a:hover, a:active.
Отговор За печат
stambentseto
Вто, 30.03.10, 19:30

phrozencrew, както винаги си прав. Това с линковете беше едно от първите неща които приложих. Вършеше работа, докато не се наложи ивента onMouseOver да задейства повече от едно действие (спрямо смяната на стила предложението ти e напълно приложимо), примерно
onMouseOver = "document.getElementById('infobar').innerHTML = 'Primeren nadpis'; this.style.color='red';"
Оттам преминах на бутони тип <input type='button'>, но IE-то не рефрешваше class-a който им задавах. В крайна сметка се спрях на <BUTTON>, тъй като се ползваше само там и спокойно може да се зададе стайлшийт за конкретния елемент.
-----------------------------------------------
insecteater и това го обмислям, но не съм взел окончателно решение.
-----------------------------------------------
Концепцията е малко заплетена в моя случай, но ето по-опростен пример:
Масива е могомерен, примерно нещо такова:
var newArr = new Array (); newArr[0] = new Array ("BTN", "Value 1", "action 1"); newArr[1] = new Array ("BTN", "Value 2", "action 2"); ... newArr[х] = new Array ("BTN", "Value х", "action х");
BTN - е данната, според която сравняваща функция ще насочва скрипта да изработва елемент BUTTON
Value - е самото име на изработвания бутон
Action - в случая е път към външен .JS файл който съдържа конкретни данни за последвала обработка
Оттам:
function MakeButton(mqsto){ var foo = document.getElementById(mqsto); // DIV-a кадето ще слагам елементи var element = document.createElement("BUTTON"); for (i=0; i<= newArr.length; i++){ element.setAttribute("value", newarr[i][1].bold()); // текста на бутона element.setAttribute("id", 'ime'+i); // id, за вслучай че трябва да премахна бутона element.setAttribute("onClick", 'reagirai(какво точно да се случи,' + newArr[i][2] + ');'); element.setAttribute("onMouseOver", "this.style.color = 'red'"); // шарении element.setAttribute("onMouseOut", "this.style.color = 'black'"); foo.appendChild(element); // Добавяне на самия бутон foo.innerHTML += '<BR>'; //Вече споменатия Туик. } }
Дотук ми се генерират бутоните с всичко което трябва да правят.
<BR>-о ми върши работа, тъй като бутоните ми трябват един под друг. Задълбавайки из нови функции в скрипта обаче, ми възникнаха известни затруднения по подредбата и стайлшийта....
Просветна ми, че за да приложа същия туик, без да скапвам нещата ми трябва възможно най-незначителния HTML таг, за да не оказва влияние.
ВОАЛА: - коментарите:.
един if (){ и да прави или <BR> или  и проблема избледнява.
Въпроса ми обаче беше дали конструирането може, и ако да как, да се приложи само с DOM.
----------------------
angelicstar ако можех да програмирам на Javа вероятно нямаше да имам подобен проблем. За жалост обаче немога.
Отговор За печат
phrozencrew
Вто, 30.03.10, 20:28

Аз, като едно много тъпо парче продължавам да се инатя, че:
element.setAttribute("onMouseOver", "this.style.color = 'red'"); // шарении
element.setAttribute("onMouseOut", "this.style.color = 'black'");
са напълно излишни.
Особено ако не променяш ткста на бутона. Примерно... ъъъ я ги екстрактни тия двете в една директория и стартирай html-a:
button_css.zip
И виж сорса на html-a. Има динамика, но няма и грам JavaScript. Ако променяш текста на бутоните, тогава става още по-лесно, но и с няколко kiB повече. Просто слагаш картинки за бекграунд на базата и на ховъра. Ако искаш ще ти направя един пример и с това. Аз съм на мнение, че onMouseOver и onMouseOut са едни от най-безсмислените и гадни функции на JavaScript.
редактиран от phrozencrew на 30.03.10 20:29
Отговор За печат
stambentseto
Вто, 30.03.10, 23:14

phrozencrew спри да се инатиш. И аз съм НАПЪЛНО СЪГЛАСЕН с теб. ако можеш да накараш чрез CSS да направи това :
OnMouseOver = "
1.да смени стила // това го може
2. да изпише в обособено място (в случая document.getElementByID('infobar')) определен текст в зависимост от бутона
3. да зареди в мястото за "Хедър"-а на страницата друг специфичен текст "
МНОГО МОЛЯ да ми дадеш един пример.
Както споменах IE-то май има проблем с опресняването на класовете за стилове при динамично създавани елементи. Вероятно твоя подход ще се получи, НО в моя случай имам зададен вече стил за линкове, който не е препоръчително да променям.
ВЪПРОСА! Конкретния въпрос на който се търси отговор е: МОЖЕ ЛИ да се постигне чрез DOM това:
.attachEvent('onclick', function(param1, param2))
където всички бутони да се насочват към една основна функция, а чрез param1 и param2 да се извърши конкретно действие за специфичния бутон.
ЗАЩОТО при мен не се получава. Може аз да съм в грешка, или да бъркам някъде, ама неще и неще.
това със стила го давам само за пример, понеже се налага да имам няколко ивента на всеки бутон.
Отговор За печат
insecteater
Сря, 31.03.10, 09:33

Да, може.
.attachEvent('onclick', function proxy() {tvoiatafunkcia(obj, param1, param2)});
Ако пращаш статични параметри, няма проблем. Това най вероятно обаче няма да ти свърши работа. Проблема всъщност е малко по-друг, но предполагам скоро ще го напипаш :)
Отговор За печат
stambentseto
Сря, 31.03.10, 10:10

insecteater омръзна ми да се занимавам с тези бъгове. Накарах го да тръгне, нали .
Ще пробвам и с проксито, скоро, може би. Ако ти се занимава, ще съм благодарен да споделиш конкретно за проблема който споменаваш. В момента съм изнервен от ситуацията и ще се занимая с други отделни функционалности на скрипта ми.
Ако сте се сетили вече, тези "бутонски" неволи са за формиране на меню. Да се занимая малко и със съдържанието . Може да открия 'Топлата вода'.
Отговор За печат
phrozencrew
Сря, 31.03.10, 10:31

Ей това ти е решението за Mozilla - addEventListener:
if(window.addEventListener){ // Mozilla, Netscape, Firefox object.addEventListener('mouseover', testevent, false); object.addEventListener('click', testeventtt, false); } else { // IE object.attachEvent('onmouseover', testevent); object.attachEvent('onclick', testeventtt); }
Примерче:
event_test.html
Отговор За печат

< 1 2 >

Коментар

за нас | за разработчици | за реклама | станете автори | in english

Форум » Програмиране и web-дизайн » HTML > DOM > JavaScript > IE > БЪГОВЕ, Бъгове и бъгове ...

HTML > DOM > JavaScript > IE > БЪГОВЕ, Бъгове и бъгове ...