[JS] IE en SetAttribute?

[MarkvE]

Ik wil via Javascript een attribuut toewijzen aan een HTML element. Met Mozilla lukt dit prima via SetAttribute() en met Opera werkt het op de volgende manier:

code:

element.onclick = 'alert("Test")';

Maar in Internet Explorer krijg ik geen respons.

Anyone?

[crisp]

In IE kan je met setAttribute geen eventhandlers toekennen aan elementen; de methode die je echter hierboven beschrijft zou met een kleine aanpassing in alle browsers moeten werken:

JavaScript:

element.onclick = function() { alert('test'); }

[MarkvE]

crisp schreef op 25 september 2004 @ 00:36:
In IE kan je met setAttribute geen eventhandlers toekennen aan elementen; de methode die je echter hierboven beschrijft zou met een kleine aanpassing in alle browsers moeten werken:

JavaScript:

element.onclick = function() { alert('test'); }

Thanks, dat werkt

Zou je misschien ook uit kunnen leggen waarom je zeg maar een functie in een functie moet zetten? Of is dit gewoon een bug in Internet Explorer?

[Verwijderd]

En het kan ook op deze manier

code:

element.onclick = new Function(alert('test'));

[Verwijderd]

Inhakend op dit puntje, ben ik benieuwd of en hoe het volgende verschil op te lossen is. Je maakt een functie addEvent zoals hieronder beschreven. Aan één element voeg je twee maal aan de click event handler een functie mee.
In IE wordt eerst de laatst toegevoegde uitgevoerd, terwijl Gecko bovenaan begint.

Verschil in de stack? Is dit recht te breien?

Java:

function addEvent(oElement, sEventName, oFunc)
{
  try {
    if (oElement.attachEvent) {
      oElement.attachEvent("on" + sEventName, oFunc);
    } else if (oElement.addEventListener) {
      oElement.addEventListener(sEventName, oFunc, false);
    }
  } catch (e) {
    return false;
  }
  return true;
}

addEvent(element, "click", function (e) {
  alert('1');
});
addEvent(element, "click", function (e) {
  alert('2');
});

[Clay]

Hmz, dat is grappig

Maar heb je hier last van dan? Ik zou zeggen dat als je op deze manier 2 losse events toekent, dat de events ook compleet onafhankelijk van elkaar opereren. Als ze per se samen moeten werken zou je het gewoon als 1 event moeten attachen.

Ik doe de try catch trouwens zelf vaak zo:

code:

try {
    element.addEventListener(type, handler, false);
} catch (inferiorBrowserException) {
    element.attachEvent('on'+type, handler);
}

om de standaard in de try te hebben, en uitzonderingen in de catch, met soms een if in die catch voor dom0 (klopt het dat macIE geen van 2^en kan?). Evt kan je de functies ook de type en handler laten returnen, om ze later te kunnen removen (misschien dat dat memory leaks voor anonymous functies in IE fixt, nog ff testen), ala:

code:

function addEvent(element, type, handler) {
    try {
        element.addEventListener(type, handler, false);
    } catch (inferiorBrowserException) {
        element.attachEvent('on'+type, handler);
    }   return {type:type, handler:handler};
}

function removeEvent(element, event) {
    try {
        element.removeEventListener(event.type, event.handler, false);
    } catch(inferiorBrowserException) {
        element.detachEvent('on'+event.type, event.handler);
    }
}

maargoed, hier ging het niet echt over

[crisp]

lol @ inferiorBrowserException

En ja, macIE kent geen attachEvent, net als IE5.0 volgens mij. Er zijn nog wel meer nadelen aan attachEvent; zo wordt de event-functie in de global scope uitgevoerd en kan je niet met het this-keyword naar het source element verwijzen. Hierdoor gebruik ik voor IE nog altijd de dom0 manier en vermijd ik het toekennen van meerdere functies aan 1 event.

[Verwijderd]

Nou, de volgorde is van belang voor nextavenue. Ik wil namelijk dat de klant enkel en alleen een javascript bestand hoeft in te voegen, waarna nextavenue de rest doet.
Om er dus voor te zorgen dat de content van de editor voor het unloaden van de pagina in een officieel form element komt (hidden textbox), moet je dus een event aan het onsubmit van alle formulieren koppelen.
Nu is het dus mogelijk dat de klant in zijn web applicatie al gebruik maakt van een onsubmit functie. Gewoonweg zeggen: document.forms[i].onsubmit = blabla is dus geen optie omdat de functie die nextavenue dan toegevoegd heeft overschreven wordt. Dat wil je niet, want dan krijgt de server nooit de html uit de editor.
Daarom zie ik attachEvent als enige oplossing. Het liefst wil ik dus dat de functie die alle hidden fields update als eerste wordt uitgevoerd, opdat de klant aan de clientside ook nog aanpassingen kan maken aan de html (enkel getters, geen setters). Op dit moment is dat dus helaas niet mogelijk.

[Verwijderd]

Maar in hoeverre lekken je handlers geheugen onder IE? Ik heb vooralsnog geen enkele manier gevonden onder IE om cyclic references helemaal uit te sluiten Gebruik van attachEvent is bij bijna nihil, omdat dat anonymous (en dus niet te verwijderen) cyclic references op leveren die onder IE altijd geheugen lekken.