CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede webweaver Praktikant
28. juli 2012 - 15:29 Der er 28 kommentarer og
2 løsninger

Tilpasse options i selectboks ud fra anden selectboks

Hej folkens

Jeg sidder og roder lidt med en form. Jeg ønsker at gøre den lidt dynamisk, men det vil ikke rigtig som jeg vil - måske nok fordi jeg ikke er den mest øvede i JavaScript.

Lad os sige, at jeg har to selectbokse. I den ene er der 50 valgmuligheder. Numrene 1 - 50. Hvis jeg vælger nummer 23 f. eks., så skal selectboks nummer to få valgmulighederne 0 - 23. Hvis jeg vælger 5 i den første selectboks, så skal selectboks to have valgmulighederne 0 - 5 osv ...

Jeg tænker umiddelbart, at jeg vil lave det ved at trække value ud af den første boks og så lave en for løkke, så den løber det ønskede antal gange og udprinter en option med et fortløbende nummer. Men det kan jeg desvære ikke få til at virke, da jeg er lidt i tvivl om, hvordan jeg får det hele til at hænge sammen. Der indgår noget PHP i den option, som skal kreeres, så det skal med ind på en eller anden måde.

Optionen skal se således ud, når den kommer ud:

<option <?php if ($_POST['antalVinduer'] == "1") {echo "SELECTED";}?>>1</option>
<option <?php if ($_POST['antalVinduer'] == "2") {echo "SELECTED";}?>>2</option>
osv...

Jeg håber der er en, som kan hjælpe mig lidt på vej, mht. hvordan det bør laves.

På forhånd tak og fortsat god weekend.
Avatar billede olebole Juniormester
28. juli 2012 - 15:55 #1
<ole>

Du kan gøre det ved at downloade alle data og lade JS foretage sorteringen på klienten.

En anden løsning er kun at downloade de nødvendige data til at starte med - og derefter hente de sorterede data med Ajax. Det er, hvad Eksperten gør på kategorisiderne.

Uanset valg af løsning, må vi nødvendigvis vide, hvilke kriterier sorteringen præcist skal foregå udfra

/mvh
</bole>
Avatar billede webweaver Praktikant
28. juli 2012 - 16:55 #2
Hej olebole,

Hvad mener du mere præcist, når du skriver "sortere data"?

Umiddelbart er der jo ikke den store sortering, da det bare er en række options, der skal "oprettes" i en selectboks. Antallet som skal "oprettes" fås fra den første selectboks, hvor der altid er valgmulighederne 1, 2,3 .. og op til 50. Så det er de kriterier, der er.

Selvfølgelig skal den "sorteres" sådan, at felterne kommer i nummerisk orden fra 0 og opefter i de oprettede options, men det vil også automatisk være tilfældet, ved at lave det i en løkke og addere tallet med 1 for hvert loop.

Jeg har overvejet AJAX, men er gået væk fra ideen igen, da der ikke er nogen grund til at benytte det, da det hele kan ordnes hos klienten og der ikke som sådan skal udføres noget PHP eller andet før en senere fase, hvor der klikkes på submit.

Alle data kan downloades. Resten skabes jo alligevel først, når der vælges et punkt i den første selectboks.
Avatar billede olebole Juniormester
28. juli 2012 - 18:38 #3
Okay, så forstår jeg. Jeg ved ikke, hvordan du udskriver den oprindelige select, men jeg har lavet et eksempel, som viser princippet:

<?php
function getSelects() {
    $aHtml = array('<select onchange="setSel(this)">');
    $sHtml = '<select id="selSecond"><option value="-1"></option></select>';
    for ($i=1; $i<51; $i++) {
        $aHtml[] = '<option value="'.$i.'">'.$i.'</option>';
    }
    $aHtml[] = '</select>';
    return implode('', $aHtml).' '.$sHtml;
}
?>

<script type="text/javascript">
var elmSecSel = null;
function setSel(elmSel) {
    if (!elmSecSel) elmSecSel = document.getElementById("selSecond");
    var elm, elmTmp = elmSecSel.cloneNode(false)
    for (var i=0; i<=elmSel.value; i++) {
        elm = document.createElement("option");
        elm.appendChild(document.createTextNode(i));
        elm.setAttribute("value", i);
        elmTmp.appendChild(elm);
    }
    elmSecSel.parentNode.replaceChild(elmTmp, elmSecSel);
    elmSecSel = elmTmp;
}
</script>

<?php echo getSelects() ?>
Avatar billede mireigi Novice
28. juli 2012 - 18:54 #4
En måde at løse det på er denne.

arrUnderkategori udfylder du med værdier fra PHP, eller du kan manuelt indtaste dem, hvis de er statiske.

Det samme gælder for mulighederne i select med ID "kategori".

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Autofill Select List</title>
</head>
<body>
    Kategori:
    <select id="kategori">
        <option value="0">Vælg</option>
        <option value="1">Mad</option>
        <option value="2">Drikke</option>
        <option value="3">Dessert</option>
    </select><br />
    Underkategori:
    <select id="underkategori" disabled="disabled">
    </select>
    <script type="text/javascript">
        var arrUnderkategori = new Array();
        arrUnderkategori[1] = [[1, "Bøf"], [2, "Hummer"], [3, "Suppe"]];
        arrUnderkategori[2] = [[1, "Vand"], [2, "Øl"], [3, "Vin"]];
        arrUnderkategori[3] = [[1, "Is"], [2, "Irish Coffee"]];

        function populateList(id)
        {
            var underkategori = document.getElementById("underkategori");
            while (underkategori.firstChild)
                underkategori.removeChild(underkategori.firstChild);

            if (id != null && id > 0 && arrUnderkategori[id] != null)
            {
                for (var i = 0; i < arrUnderkategori[id].length; i++)
                {
                    var option = document.createElement("option");
                    option.value = arrUnderkategori[id][i][0];
                    option.text = arrUnderkategori[id][i][1];

                    underkategori.appendChild(option);
                }
                underkategori.removeAttribute("disabled");
            }
            else
            {
                underkategori.setAttribute("disabled", "disabled");
            }

        }

        document.getElementById("kategori").onchange = function () { populateList(this.value); };
    </script>
</body>
</html>
Avatar billede olebole Juniormester
28. juli 2012 - 19:42 #5
Det er vist noget helt andet, der spørges om - og så er fremgangsmåden ikke særlig effektiv. Når der skal udføres mange DOM-manipulationer på et element, bør det trækkes ud af DOM-træet imens. Ellers sætter man browseren på unødigt renderingsoverarbejde  *o)
Avatar billede olebole Juniormester
28. juli 2012 - 19:43 #6
- og så skal et SELECT element i øvrigt indeholde mindst ét OPTION element, når siden loades
Avatar billede webweaver Praktikant
28. juli 2012 - 21:18 #7
Tak for jeres løsninger.

Jeg har forsøgt at bygge videre på dit princip olebole, og det virker ganske glimrende. Det fungerer lige som jeg havde tænkt mig - næsten da. Der er et par problematikker i forbindelse med måden at udføre det på som driller mig lidt.

Problemet er, at der ikke sker noget, før man har lavet et valg i den første selectboks. Det er klart, eftersom det er onChange som benyttes.

Den første selectboks starter default på 1. Da det nogen gange vil være vedkommendes valg, vil den anden selectboks ikke fungere, da der ikke er foretaget en "forandring" i den første.

Det samme gør sig gældende ved klik på submit, og hvor valideringen returnerer false. Der vil den anden selectboks opbygget af JS ikke huske det valg, der er gjort. Den vil være nulstillet. Det vil den første selectboks ikke (da jeg har tilføjet lidt PHP, så den husker valget). Men igen, vil den anden selectboks ikke fungere, da der ikke er gjort et aktivt valg i den første selectboks. Det er selvfølgelig planen, at den skal huske valget ved en false validering.

Lige af hvad jeg kan gennnemskue, bør disse problematikker kunne løses ved brug af onLoad ved siden af onChange. Jeg synes dog at huske noget om, at onLoad ikke fungerer direkte nede på et selectelement, hvorfor jeg har forsøgt mig med det i body elementet uden held.

Har forsøgt mig med noget i stil med <body onLoad="SetSel(*)">

Hvor * er den værdi som den første selectboks har og SetSel er navnet på JavaScript funktionen.

Det fungerer dog umiddelbart ikke.

Nogen ideer?
Avatar billede olebole Juniormester
28. juli 2012 - 21:56 #8
Som jeg læser spørgsmålet, skal den anden SELECT være tom fra start. Er det ikke tilfældet, må jeg vide, hvad den så skal indeholde.

Valideringsfejlen skyldes uhensigtsmæssig validering. Af hensyn til brugeren valideres med JavaScript. Efterfølgende valideres af sikkerhedsmæssige grunde på serveren.

Med mindre, du har besøg af en hacker, fanger din JS-validering evt. fejl. Har du besøg af en hacker, behøver du ikke tage hensyn til vedkommendes brugeroplevelse, eller hvad der evt. måtte være nulstillet  =)
Avatar billede webweaver Praktikant
28. juli 2012 - 22:41 #9
Det skal den ikke :-) Da den første selectboks står på 1 pr. default, når man kommer ind på siden, skal den anden selectboks derfor have valgmulighederne 0 og 1 allerede fra start af. Men det er jo nemt nok at fikse. Det er bare at give dem de to options i ren HTML fra starten af i stedet for den ene du har givet i dit eksempel.

Jeg ved nu ikke om jeg er helt enig med dig i, at valideringsprocessen er uhensigtsmæssig. Jeg går ud fra din mening henvender sig mod, at jeg validerer datainput på serveren fremfor hos klienten :-)

Jeg validerer altid så vidt muligt data igennem PHP (eller hvad det nu er), da jeg personligt synes bedst om dette. Dette er mere driftsikkert i min verden, da JavaScript kan deaktiveres af klienten. Jovist, så kan man selvfølgelig bare sørge for, at man ikke kan bruge formularen, hvis det er tilfældet, men så er hele den del af websitet også lagt ned og det kan jo være i en større eller mindre grad afhængig af den enkelte hjemmeside. Det er ikke et problem ved validering på serveren, da det altid vil fungere. Det kræver et reload og en lidt længere rejse for datapakken ja, men det synes jeg personligt ikke generer specielt meget. Det generer i hvert fald ikke mig - medmindre der er lange svartider fra serveren naturligvis.

At en person sjældent deaktiverer JavaScript er naturligvis rigtigt. Men det sker, da der er folk som konsekvent slår det fra, for at slippe for en masse irriterende skrammel som man desværre også kan (mis)bruge JavaScript til. Man kan selvfølgelig sagtens vælge bare at udelukke den del af potentielle kunder, da det er et fåtal, men der ønsker jeg hellere at levere en løsning, der virker for alle.

Angående hackere, så er jeg fuldstændig ligeglad med disse i denne situation. Det er hverken en form til login eller lignende med personfølsomme data bagved, så der er ikke det store mål i det for dem. Validering sker udelukkende for at sikre vi får de data igennem vi forventer og for at sørge for at holde spambots og irriterende teenagere, der keder sig på afstand.

Validering i klient eller ej, så forstår jeg nu stadig ikke helt, hvorfor det ikke virker at give den en værdi igennem onLoad på bodytag'et, da det så burde være "kørende" allerede før en ændring er foretaget i selectboksen.
Avatar billede olebole Juniormester
28. juli 2012 - 23:00 #10
"Jeg validerer altid så vidt muligt data igennem PHP (eller hvad det nu er), da jeg personligt synes bedst om dette. Dette er mere driftsikkert i min verden" >> Du blander æbler og pærer  =)

1) Udfra et brugervenlighedssynspunkt kan du ikke undvære validering i JavaScript.
2) Udfra et sikkerhedssynspunkt kan du ikke undvære validering i PHP.

Det er to fundamentalt forskellige ting, som ikke bør forveksles - og ikke kan erstatte hinanden. Begge dele bør være tilstede i enhver seriøs webapplikation.

Om der ligger følsomme oplysninger i den app. eller ej, bør ikke være afgørende for dine sikkerhedstiltag. Din sikkerhed i hver enkelt lille krog af din kode har afgørende betydning for hele serveren - og i værste fald hele hotellet.

Hvad det så er, der er dit egentlige problem, har jeg stadig ikke forstået. Du skriver, at den anden select 'ikke fungerer' - men hvad det betyder, ved jeg ikke  =)
Avatar billede webweaver Praktikant
29. juli 2012 - 00:14 #11
Ved submit, og hvis en validering ikke går igennem, så gemmes det valgte nummer ikke i den selection som skabes ud fra JS funktionen. Den nulstiller og står dermed på 0 igen.

For at man kan vælge det rigtige tal nu, skal der foretages en aktiv handling i den første selection, da onChange ellers ikke aktiveres. Den første selection gemmer sin værdi ved en falsk validering. Derfor er man nu nødt til at vælge et "forkert" tal, for derefter at gå tilbage på det rigtige tal, og herefter kan man så vælge det rigtige tal i den anden selectionboks også.

Det kan være lidt svært at forklare, men du kan teste det/se det visuelt, da jeg har lagt systemet online. http://www.dengroennefroe.dk/Beregning

Prøv at sætte "antal vinduer i alt" til 10 og "heraf antal vinduer" til 5 og klik så submit uden at udfylde andet. Du vil nu opdage, at den første selectboks du udfyldte gemmer sin værdi. Den anden nulstiller, og du kan ikke vælge 5 igen, uden at skulle vælge på ny i begge bokse. Det er ikke hensigtsmæssigt for brugeren, så det går ikke. Det er problemet lige nu.

Derfor er det som jeg ser det, nødvendigt at tilføje et "SELECTED mærke" ind på den rigtige option, så den gemmer værdien samt flette en onLoad ind, så den henter 0 - 10 ind igen automatisk.
Avatar billede mireigi Novice
29. juli 2012 - 02:41 #12
Det problem kan løses på flere måder:

<body onload="selectNumber(null)">


   <script type="text/javascript">
      selectNumber(null);
   </script>
</body>


   <script type="text/javascript">
      window.onload += function(){ selectNumber(null); };
   </script>
</head>


Jeg er mest tilhænger af den sidste.

Vil du slippe for javascriptet, kan du lave det i den bagvedliggende kode (PHP?) i stedet for.
Avatar billede olebole Juniormester
29. juli 2012 - 05:22 #13
#11: Jamen, det er jo et ikke-problem. Valider med JavaScript og med PHP. Hvis det er en fejl, fanger du den med JS - og der submittes ikke.

Hvis det ikke er en fejl, men én der bevidst prøver at lave noget, han ikke burde, er der ingen grund til at tage hensyn til ham. Du fanger handlingen med PHP, og han kan passende begynde fra start.

Hvis der er tale om en fejl, er der ingen grund til at spilde brugerens tid med at skulle en tur forbi serveren. Det old-school 90'er tilgang.

@mireigi: Er der en speciel grund til, at du foretrækker den sidste version - udover, at den i hvertfald ingen skade gør?  =)
Avatar billede webweaver Praktikant
29. juli 2012 - 15:53 #14
Jeg har taget det til efterretning og lavet en JavaScript-validering foran PHP-kontrollen på hele formen, så der ikke foretages en unødvendig submit, som også giver andre problemer (dem tidligere nævnt) ..

Det vil sige, at det hele fungerer som det skal nu.

Tak for hjælpen!

olebole smid et svar. Du gav et eksempel, der relativt simpelt kunne bygges om og dermed fungere i mit system.

mireigi du kan også bare smide et svar. Din løsning fungerer ikke umiddelbart til det jeg efterspørger, men du har stadig brugt lidt tid på at forsøge at hjælpe :-)

Fortsat god weekend :o)
Avatar billede olebole Juniormester
29. juli 2012 - 16:10 #15
Det lyder fornuftigt. Så har du formodenlig også haft tid til at tænke argumentationen mod en JS-validering fra #9 igennem og set, at den ikke holder en halv dråbe vand  *o)

Ellers tak, jeg samler som bekendt ikke point  =)
Avatar billede olebole Juniormester
29. juli 2012 - 16:14 #16
- og hvad events angår, så er den rigtige måde at sætte en event på, at bruge addEventListener eller attachEvent (afhængig af browser) - og så fjerne den igen, når den ikke længere skal bruges. Det kan f.eks. gøres med dette X-browser objekt:

var evnt = (function(){
    if (window.addEventListener) return {
        add: function(obj, sType, fn) {
            obj.addEventListener(sType, fn, false);
        },
        rem: function(obj, sType, fn) {
            obj.removeEventListener(sType, fn, false);
        }
    };
    return {
        add: function(obj, sType, fn) {
            obj.attachEvent("on"+sType, fn);
        },
        rem: function(obj, sType, fn) {
            obj.detachEvent("on"+sType, fn);
        }
    }
})();

- og det anvendes som følger:

function init() {
    // Gør en hel masse her
    // - når dokumentet er loaded
   
    evnt.rem(window, "load", init);
}

evnt.add(window, "load", init);
Avatar billede webweaver Praktikant
29. juli 2012 - 16:53 #17
Nu er det ikke just JavaScript jeg roder mest med, så har lidt svært ved at gennemskue, hvordan dit eksempel fungerer og hvordan jeg bør benytte det.

Men altså det du egentlig siger er, at jeg først bør hente/køre diverse funktioner, når de rent faktisk skal bruges?

Altså eksempelvis valideringen. Den skal først køres ved et klik på submit. Derved kan man med addEventListener skrive ind, det skal ske ved click, den funktion det drejer sig om og så en boolean. Eller hvad?

Og hvilken fordel giver det? Hurtigere ydelse? Til gengæld er der meget af det som ikke er cross-browser pålideligt. Hvorfor du nok også kombinere to anvendelsesmuligheder?
Avatar billede olebole Juniormester
29. juli 2012 - 17:25 #18
Nu var event-handler-objektet mest ment i forhold til mireigi's forsøg på at sætte en onload handler ... ikke mindst hans ikke-fungerende 'favoritversion' (nummer tre)  =)

Spekulationer om, hvorvidt man overhovedet bør bruge JS til at validere med, når det teoretisk kan slås fra, er næppe heller aktuelle ved en applikation, hvis virkemåde afhænger af, at JS er slået til  *o)

Du har ret i, at der stadig er forskelle mellem browsernes JS-implementeringer, men de er efterhånden *meget* små - og langt mindre end forskellene mellem HTML- og CSS-fortolkningerne.

Hvis du gør som følger, virker det i alle gængse browsere - og meget langt tilbage:

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
var evnt = (function(){
    if (window.addEventListener) return {
        add: function(obj, sType, fn) {
            obj.addEventListener(sType, fn, false);
        },
        rem: function(obj, sType, fn) {
            obj.removeEventListener(sType, fn, false);
        }
    };
    return {
        add: function(obj, sType, fn) {
            obj.attachEvent("on"+sType, fn);
        },
        rem: function(obj, sType, fn) {
            obj.detachEvent("on"+sType, fn);
        }
    }
})();

function validate(e) {
    var bKill = false;
    if (this.navn.value==="") {
        alert("Du skal skrive dit navn.");
        this.navn.focus();
        bKill = true;
    }
    else if (this.phone.value==="") {
        alert("Du skal skrive dit telefonnummer.");
        this.phone.focus();
        bKill = true;
    }
   
    if (bKill) {
        if (e) e.preventDefault();
        else event.returnValue = false;
        return;
    }
   
    evnt.rem(this, "submit", validate);
}

function init() {
    var elmFrm = document.getElementById("minForm");
    evnt.add(elmFrm, "submit", validate);
    evnt.rem(window, "load", init);
}

evnt.add(window, "load", init);
</script>
</head>
<body>

<form id="minForm" action="">
    <p><label>Navn: <input name="navn" type="text"></label></p>
    <p><label>Telefon: <input name="phone" type="text"></label></p>
    <p><button type="submit">Send</button></p>
</form>

</body>
</html>
Avatar billede olebole Juniormester
29. juli 2012 - 17:59 #19
Lige en forklaring af denne konstruktion:

var evnt = (function(){
    if (window.addEventListener) return {
        add: function(obj, sType, fn) {
            obj.addEventListener(sType, fn, false);
        },
        rem: function(obj, sType, fn) {
            obj.removeEventListener(sType, fn, false);
        }
    };
    return {
        add: function(obj, sType, fn) {
            obj.attachEvent("on"+sType, fn);
        },
        rem: function(obj, sType, fn) {
            obj.detachEvent("on"+sType, fn);
        }
    }
})();

Alle browsere, untagen IE, understøtter ELEMENT.addEventListener. Da variablen evnt sættes til en 'selvafviklende' funktion (parenteserne efter function statement'et gør, at funktionen afvikles, når den læses), vil variablen se sådan ud i alle ikke-IE browsere:

var evnt = {
    add: function(obj, sType, fn) {
        obj.addEventListener(sType, fn, false);
    },
    rem: function(obj, sType, fn) {
        obj.removeEventListener(sType, fn, false);
    }
}

- og sådan, hvis browseren er en IE:

var evnt = {
    add: function(obj, sType, fn) {
        obj.attachEvent("on"+sType, fn);
    },
    rem: function(obj, sType, fn) {
        obj.detachEvent("on"+sType, fn);
    }
}

Det betyder, jeg kun bruger kræfter på at spørge til, hvad browseren understøtter, én gang. Derfra indeholder objektet de to metoder, som er 'skræddersyet' til browseren.

Hvis du skriver:

window.onload = init;

- så fyres kun den ene funktion (init) af på onload. I den funktion må du så foretage alle de andre funktionskald, der måtte skulle udføres på onload.

Når du bruger de to browserspecifikke metoder, tilføjer du hver handler funktion til en liste. Når event'en fyres af, bladres denne liste igennem og alle handlerne kaldes på stribe.

Du kan som eksempel prøve denne:

<script type="text/javascript">
function foo() {
    alert("Foo");
}
function bar() {
    alert("Bar");
}

window.onload = foo;
window.onload = bar;
</script>

- og derefter denne:

<script type="text/javascript">
var evnt = (function(){
    if (window.addEventListener) return {
        add: function(obj, sType, fn) {
            obj.addEventListener(sType, fn, false);
        },
        rem: function(obj, sType, fn) {
            obj.removeEventListener(sType, fn, false);
        }
    };
    return {
        add: function(obj, sType, fn) {
            obj.attachEvent("on"+sType, fn);
        },
        rem: function(obj, sType, fn) {
            obj.detachEvent("on"+sType, fn);
        }
    }
})();

function foo() {
    alert("Foo");
}
function bar() {
    alert("Bar");
}

evnt.add(window, "load", foo);
evnt.add(window, "load", bar);
</script>
Avatar billede mireigi Novice
29. juli 2012 - 22:02 #20
@olebole:[b] Jeg foretrækker den sidste fordi jeg så undgår to ting:
1. Clutter i body-tagget, hvis flere functions skal afvikles onload.
2. Usikkerhed om, hvorvidt andre functions er startet. Nogle startes, hvor de er indsat på siden, andre først ved onload.

Jeg må dog lige huske at skrive din eventlistener ned. Kan aldrig huske den :)

[b]@webweaver: Bare giv mig 10- point og tag resten selv. Vil ikke tage det hele, når olebole har været primære bidrager til løsningen.
Avatar billede webweaver Praktikant
29. juli 2012 - 22:52 #21
Du får lidt ekstra udover de 10 point. Jeg kan godt undvære dem :o)

#olebole, jeg kigger nærmere på din forklaring og dine eksempler, så snart jeg får tid :)
Avatar billede olebole Juniormester
30. juli 2012 - 04:29 #22
#20: Min pointe tidligere var, at den tredie ikke fungerer. I stedet skal du ud i noget i stil med:

<script type="text/javascript">
var oEvntWinLoad = window.onload;
if (typeof oEvntWinLoad==="function") {
    window.onload = function() {
        oEvntWinLoad();
        selectNumber(null);
    }
} else {
    window.onload = function(){ selectNumber(null); };
}
</script>
- men det er langt mere effektivt at bruge 'rigtige' event listeners.

Desuden har det den fordel (hvis man undgår at pakke ind i anonyme funktioner), at keyword'et this - som det skal - peger på target elementet indenfor handleren.

Det betyder ikke så meget, når eventen stammer fra Window objektet, men det er vigtigt ved alle andre event targets
Avatar billede olebole Juniormester
30. juli 2012 - 04:30 #23

<script type="text/javascript">
var oEvntWinLoad = window.onload;
if (typeof oEvntWinLoad==="function") {
    window.onload = function() {
        oEvntWinLoad();
        selectNumber(null);
    }
} else {
    window.onload = function(){ selectNumber(null); };
}
</script>

... sådan!  =)
Avatar billede mireigi Novice
30. juli 2012 - 12:53 #24
@olebole: Så lærte jeg jo noget nyt i dag også :)

Men hvad er den egentlige årsag til at det ikke virker? Jeg kan fint få det til at virke, også med flere functions i onload - så det må vel være noget cross-browser halløj?

Og er
windows.onload +=...;

Ikke det samme som du gør?

Er onload == null, tilføjes den nye function
Er onload != null, tilføjes den nye function til sidst i rækken af scripts.

Eller har jeg helt misforstået += i brug ved functions?
Avatar billede olebole Juniormester
30. juli 2012 - 14:48 #25
Nej, det er noget fundamentalt andet. Det giver set fra et programmatisk synspunkt absolut ikke mening at bruge '+' i den sammenhæng.

Nej, det har intet med 'X-browser halløj' at gøre. Undskyld mig, men der er tale om helt åbenlyst 'kodevrøvl', som ikke må kunne fungere i nogen somhelst browser. Operatoren '+' kan henholdsvis konkatenere strenge og addere tal - men den giver ingen mening i forbindelse med strenge.

Jeg er 100% sikker på, du husker forkert, hvis du mener at have set det virke  =)
Avatar billede olebole Juniormester
30. juli 2012 - 14:49 #26
- men da jeg også er vild med at lære, må du på den anden side meget gerne vise mig et eksempel på, at du kan få det til at fungere  =)
Avatar billede mireigi Novice
30. juli 2012 - 23:01 #27 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
    <script type="text/javascript">
        window.onload += new function () { alert("Hej"); };
    </script>
</head>
<body>
</body>
</html>


Det virker ganske fint hos mig i nyeste version af FireFox. Det skal dog lige siges, at uden new keywordet, virker det ikke.
Avatar billede olebole Juniormester
30. juli 2012 - 23:14 #28
Så er det lettere bare at skrive:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ (...)
<html xmlns="http://www.w3.org/ (...)
<head>
    <title>Untitled Page</title>
    <script type="text/javascript">
        alert("Hej");
    </script>
</head>
<body>
</body>
</html>

- og resultatet er præcis det samme. Alert'en fyres af i det øjeblik, browseren læser den pågældende linje  =)
Avatar billede mireigi Novice
30. juli 2012 - 23:39 #29
Ah ja, det er selvfølgelig derfor det fungerer :)

Fik lige læst lidt op på det imens.

Sådan går det når alt er selvlært og man drager konklusioner ud fra egne erfaringer :)
Avatar billede olebole Juniormester
31. juli 2012 - 00:34 #30
Din erfaring holdt jo godt nok ... men tolkningen var knap så heldig  =)

Den gamle kvantefysiker Werner Heisenberg sagde engang de kloge ord:

"Det, vi oplever, er ikke naturen - men naturen, udsat for vores måde at spørge på"

Når det det glimter i lille Theofiles Flyvehans's ble, er det måske ikke besøget hos nummerologen, som udmønter sig i, at han nu skider guld. Det kunne også bare være, fordi han har forædt sig i en æske af farfars messingstifter  *D
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
Sæt vindue størrelse Af poulmadsen i JavaScript 1 08/10/202417:18 13/10/202412:33
Opgavestyring Af ingeman i JavaScript 1 15/09/202416:06 15/09/202420:40
Returner ikke alt Af ingeman i JavaScript 13 26/06/202414:40 01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript 4 24/06/202422:50 26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript 6 04/06/202416:23 05/06/202414:23
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
IT-JOB

SporingsGruppen ApS

Backend-udvikler

KMD A/S

.NET Developer

Ward247 ApS

IT Operations Manager

Region Midtjylland

Infrastrukturarkitekt til Digitalisering og It i Region Midtjylland

Cognizant Technology Solutions Denmark ApS

Sr. Test Analyst
Seneste spørgsmål Seneste aktivitet
I går 20:49 pop up black friday Af Malm i Virus
I går 18:31 Hvor finder jeg en netværksdriver? Af jcr18 i Wifi
I går 16:49 Identificér og hent del af tekststreng Af TheLibrarian i Excel
I går 16:30 Smart vægt til fitness tracking Af Henrik i Fitness & Smartwatches
I går 08:08 touchpad virker ikke Af Malm i PC
White papers
Flere white papers »


Premium
Teaser billede
Vil købe tele-løsninger til det offentlige for 370 millioner kroner
Læs mere »
Efterspørgslen på AI-regnekraft er enorm - og det smitter af på priserne: "Vi kan sælge næsten alt, hvad vi får ind"
Nyt værtøj fra Microsoft: Snart kan du reparere nedbrudte Windows-enheder på distancen
Politiet skriver kontrakt på 75 millioner kroner med dansk it-firma: Medarbejdere skal flytte ind hos politiet
Se alle »
Computerworld
Teaser billede
Microsofts nye pc er ekstrem billig – men kan blive ekstrem sikker og fleksibel
Læs mere »
Test: Audi Q6 er en super fed SUV - men gør dig selv en tjeneste og kast flere penge efter den
Test: Prøv kun disse B&O-hovedtelefoner, hvis du har råd
Kæmpe datalæk på hospital: 750.000 patienters fortrolige data lækket
Se alle »
CIO
Teaser billede
Konsulenthus vil rulle Microsoft 365 Copilot ud til 200.000 ansatte
Læs mere »
Kæmpe-opgave for Danske Bank har banet vej for fuldautomatiseret migrering til cloud: Nu udbredes metoden i hele AWS
Stor sag mod Microsoft kan være på vej: Beskyldes for at låse Azure-kunder fast med ulovlige metoder
Microsofts store årlige event: De tre vigtigste nøglebudskaber fra Satya Nadella om Microsofts fremtid
Se alle »
Job & Karriere
Teaser billede
Microsoft klar med ny direktion for den danske forretning: Her er de nye direktører
Læs mere »
Tre Norlys-topchefer fratræder med omgående virkning: Internet-forretningen er udfordret - vil have mere fart i integrationen af Telia Danmark
Efter skelsættende møde med sportscoach: Stor dansk it-arbejdsplads indfører fredags-fri og isbade i arbejdstiden
Linus Torvalds giver russiske Linux-udviklere sparket: Vil ikke have noget med dem at gøre
Se alle »
White paper
Teaser billede
MDR: Transparent sikkerhed og overvågning i realtid
Læs mere »
Styrk compliance, sikkerhed og overblik med ét hug
Sikkerhed uden grænser: Cisco Hypershield
Sæt turbo på din cloudperformance og minimér risikoen for DDoS-angreb
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »