Avatar billede elskermad.dk Nybegynder
09. september 2006 - 10:39 Der er 13 kommentarer og
1 løsning

attachEvent - i xhtml

Hej Eksperter!

Jeg kan ikke helt gennemskue hvordan jeg sætter en onChange på min select oprettet direkte i DOM'en.

Jeg har denne kode men den virker desværre ikke: (der bliver ikke tilknyttet en onChange-event)

boks                    = document.createElement('select');
boks.setAttribute('id','sidevalg');
boks.setAttribute('name','sidevalg');
boks.className            = 'sidevalg';

if (window.addEventListener) boks.addEventListener('onChange',function(){side(this.value,0)},false);
else if (window.attachEvent) boks.attachEvent('onChange',function(){side(this.value,0)});

    sider                    = Math.ceil(antal / perside);
   
    for(i=0;i<sider;i++) {
        side                = document.createElement('option');
        side.setAttribute('value',i+1);
        side.appendChild(document.createTextNode('Side ' + (i+1)));
       
        boks.appendChild(side);
    }
   
span.appendChild(boks);
Avatar billede mclemens Nybegynder
09. september 2006 - 16:11 #1
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

if(window.addEventListener)window.addEventListener("load", function(){wload();}, false);
else if(window.attachEvent)window.attachEvent("onload", function(){wload();});


function wload(){

span=document.getElementById("test");
antal=10;
perside=2;





boks=window.elmcreation("select","sidevalg");

boks.setAttribute('id','sidevalg');
boks.className            = 'sidevalg';

if (boks.addEventListener) boks.addEventListener('change',function(){siden(boks.value,0)},false);
else if (boks.attachEvent) boks.attachEvent('onchange',function(){siden(boks.value,0)});

    sider                    = Math.ceil(antal / perside);
 
    for(i=0;i<sider;i++) {
        side                = document.createElement('option');
        side.setAttribute('value',i+1);
        side.appendChild(document.createTextNode('Side ' + (i+1)));
     
        boks.appendChild(side);
    }
 

span.appendChild(boks);



}



function siden(t,t2){
  alert(t+","+t2);
}










IE=((document.all)&&(navigator.userAgent.indexOf('Opera')== -1))?true:false;

window["elmcreation"]=function(tag,name){
  if(name){
    if(IE)tmp=document.createElement("<"+tag+" name="+name+"></"+tag+">");
    else{
      tmp=document.createElement(tag);tmp.setAttribute("name",name);
    }
  }else tmp=document.createElement(tag);
  return tmp;
}
</script>

</head><body>
<span id="test"></span>
</body></html>
Avatar billede mclemens Nybegynder
09. september 2006 - 16:13 #2
Kig evt. også på:
http://www.eksperten.dk/spm/726647#rid6385051
... der er forklaringen på fusket med name ...
Avatar billede mclemens Nybegynder
09. september 2006 - 16:26 #3
P.s.: side virkede ikke så godt som funktionsnavn - rettede det derfor til siden ...
Avatar billede mclemens Nybegynder
09. september 2006 - 17:57 #4
Her er lige en quote fra:
http://kundeservice.tdc.dk/privat/internet/faq.php?id=75672

[ TDC Hastighedstest har plads til mange brugere
Et problem med hastighedsteste er, at de er populære. Så populære, at der er rigtig mange, der anvender dem samtidig. Det kan betyde, at selve hastighedstesten bliver en flaskehals.

TDC Hastighedstest kører på en pc med høj kapacitet, og vi har en gigabit-forbindelse direkte ud til TDC's net. Det betyder, at vi har plads til rigtig mange samtidige brugere.

Der kan faktisk være helt op til 100 samtidige brugere med 10 Mbit/s hver. Det lyder måske ikke af mange, men normalt er der ikke mere end 30 samtidige brugere.

Vi overvåger pladsen på testserveren hele døgnet og bliver varslet, hvis vi nærmer os grænsen. I så fald har vi en opgradering stående parat. ]


... Så hvis det skal være præcis og ikke bare et billede - så er det krævende :o)
Avatar billede mclemens Nybegynder
09. september 2006 - 17:58 #5
Undskyld elskermad ... forkert tråd ;)
... ovenstående skulle have været i
http://www.eksperten.dk/spm/731264 :D
Avatar billede elskermad.dk Nybegynder
10. september 2006 - 12:12 #6
hej mclemens,

jeg er måske ikke helt med - er det nødvendigt at lave de to første linier som tilknytter noget til onLoad-eventet? og ang. name-attributen er det ikke et must den er der da den eneste funktion selectboksen har, er at opdatere siden udfra dens value.

Så det er vist ikke nødvendigt med en ekstra funktion til at omgå IE?
Avatar billede elskermad.dk Nybegynder
10. september 2006 - 12:19 #7
jeg har fundet dette men det virker heller ikke efter hensigten:

// selectboks
boks                    = document.createElement('select');
boks.className            = 'sidevalg';

// tilføj onchange-event
if (window.addEventListener) {
    // W3C, Mozilla (Firefox/Netscape6+), Safari, Konqueror
    boks.addEventListener('onChange',function(){document.location.href='?side=' + this.value},false);
}
else if(document.addEventListener) {
    // Opera 7
    boks.addEventListener('onChange',function(){document.location.href='?side=' + this.value},false);
}
else if(window.attachEvent) {
    // IE (win)
    boks.attachEvent('onChange',function(){document.location.href='?side=' + this.value});
}
Avatar billede mclemens Nybegynder
10. september 2006 - 12:24 #8
boks.value ikke this.value

[ jeg er måske ikke helt med - er det nødvendigt at lave de to første linier som tilknytter noget til onLoad-eventet? ] Onload event var for at lave et test eksempel...

[ og ang. name-attributen er det ikke et must den er der da den eneste funktion selectboksen har, er at opdatere siden udfra dens value. ] Ok, så bare at du havde en
boks.setAttribute('name','sidevalg'); i oplægget ...

Det du nok skal bruge er blot:

if (boks.addEventListener) boks.addEventListener('change',function(){siden(boks.value,0)},false);
else if (boks.attachEvent) boks.attachEvent('onchange',function(){siden(boks.value,0)});


eller hvis det skal være den anden funktion:

if (boks.addEventListener) boks.addEventListener('change',function(){window.location.href=window.location.href+'?side='+boks.value},false);
else if (boks.attachEvent) boks.attachEvent('onchange',function(){window.location.href=window.location.href+'?side='+boks.value});

(sidste del er ikke testet)
Avatar billede mclemens Nybegynder
10. september 2006 - 12:28 #9
^ - Den sidste del virkede ... men ved flere clicks kom der til at stå ?side=1?side=4 o.s.v. derfor er denne nok bedre:



if (boks.addEventListener) boks.addEventListener('change',function(){window.location.href=window.location.pathname+'?side='+boks.value},false);
else if (boks.attachEvent) boks.attachEvent('onchange',function(){window.location.href=window.location.pathname+'?side='+boks.value});
Avatar billede mclemens Nybegynder
10. september 2006 - 12:32 #10
Læg mærke til at i addEventListener er det 'change'
men det er 'onchange' i attachEvent ...

Og så checker jeg på:
if (boks.addEventListener) og else if (boks.attachEvent)
istedet for if (window.addEventListener) og else if (window.attachEvent)
- Da jeg kun vil "tilknytte" en eventhandler hvis det er muligt på selve elementet
og ikke afhængig af om window vil acceptere en tilknytning af eventhandleren ...
... Ved dog ikke om det har betydning udover hvis vi piller ved måske textNodes?

... og så var der this.value -> boks.value
Avatar billede mclemens Nybegynder
10. september 2006 - 12:39 #11
og document.location -> window.location
Avatar billede elskermad.dk Nybegynder
10. september 2006 - 13:04 #12
Sådan nu kom onchangen på :)

Lige et par læringsspørgsmål:
hvorfor boks.value istedet for this.value ? når onchangen bliver udført er det vel på this'ens value og ikke hvad jeg har oprettet tidligere?

I mit eksempel har jeg tre måder at lave onChange på - er den sidste ligegyldig?

og ja, window.location ;) - plejer altid blot at skrive location.href

Skal lige se om jeg kan finde ud af at den selv laver en selected på den rigtige option, hvis ikke vender jeg lige tilbage!
Avatar billede elskermad.dk Nybegynder
10. september 2006 - 13:06 #13
det kunne jeg - det er godt nok lækkert at arbejde med den her måde at skrive javascript når man først lige kommer ind i det :)

men går nok noget tid inden man er bekendt med alle functioner og finesser...

tak for hjælpen - igen igen!
Avatar billede mclemens Nybegynder
10. september 2006 - 13:31 #14
[ hvorfor boks.value istedet for this.value ? når onchangen bliver udført er det vel på this'ens value og ikke hvad jeg har oprettet tidligere? ] Jeps, den del har du ret i :/

... Jeg lavede forresten en fejl det skal ikke
være boks.value men boks.getAttribute("value")

- M.h.t. this vs. boks så er this når man definerer funktionen der skal udføres
ikke lig boksen men lig funktionen man kører - det er derfor det oprettede element
vi skal pille ved (i dette tilfælde angivet som boks) ... umiddelbart kan man også kaste det i en eval - men det er nok ikke optimalt :D
function(){eval("window.location.href=window.location.pathname+'?side='+this.getAttribute('value')")}
(ikke testet)


[ I mit eksempel har jeg tre måder at lave onChange på - er den sidste ligegyldig? ]
Den mellemste til Opera 7 er vel unødvendig? Fejlen er når jeg ser på if'erne at Opera 7 ikke understøttede addEventListener på window objectet. Tror det er understøttet i Op 9 - og brugere er flittige til at opgradere idag så den er nok overflødig :)
((( og i dette tilfælde er det jo heller ikke window eller document eventhandleren skal checkes på - men istedet boks'en ... )))

...

Velbekom, og tak for point :o)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

IT-JOB

Netcompany A/S

Test Consultant

Styrelsen for Grøn Arealomlægning og Vandmiljø

Teamleder til Application Management

Nextway Software A/S

Product Configuration Specialist

Forsvarsministeriets Materiel- og Indkøbsstyrelse

Kickstart din IT-karriere som IT-supporterelev på Flyvestation Aalborg