WN - Dynamiska formulär med Jquery

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Dynamiska formulär med Jquery (https://www.wn.se/forum/showthread.php?t=37632)

Kod:

$(document).ready(function() {

 $("input[name=upgrade]").change(function() {

 var value = $('#theform input:radio:checked').val();

 if (value == "time") {

  $("#upgradebox").slideUp("slow", function () {

  $("#timebox").slideDown("slow");

  });

 }

 });

});

Koden här ovan är ett tappert försök att om man markerar den radioknappen vars värde är "time" så ska den ta upp en ruta om den är utfälld och sedan ta ner en annan ruta, med ett annat formulär

Men ingenting händer, någonting verkar vara fel... och jag kan inte för mitt liv räkna ut vad. Någon som vill berätta för mig det rekommenderade sättet att hantera radio buttons med Jquery?

Jag ser inga felaktigheter. Eller vänta nu... Din beskrivning stämmer inte överens med kodsnutten. I koden görs radiobuttonkontrollen när onchange triggas på formulärelement upgrade. Är det inte så det ska vara är det bara att ta bort lyssnaren och lägga den på radiobuttonselektorn istället. Det borde funka utan några andra ändringar.

Försök också vara så specifik som möjligt med selektorerna. input[name=upgrade] kan t.ex. ställa till med problem om du har flera element med samma namn på sidan. Utöver det får man bättre prestanda om man är nogrann med att peka ut vägen till elementen. Man märker det kanske inte så mycket på en vanlig dator men sitter man vid en burk med sämre prestanda - Atom-baserade netbooks t.ex. - då märker man skillnad. Det kan vara bra att ha i bakhuvudet.

Citat:

Originally posted by dAEk@Jun 27 2009, 23:01
Utöver det får man bättre prestanda om man är nogrann med att peka ut vägen till elementen. Man märker det kanske inte så mycket på en vanlig dator men sitter man vid en burk med sämre prestanda - Atom-baserade netbooks t.ex. - då märker man skillnad. Det kan vara bra att ha i bakhuvudet.

Logiskt sett kan jag tycka att du borde ha rätt, men ofta är det faktiskt tvärtom. Så länge man använder taggnamn eller IDs innan en attribut-selektor har du rätt. Men gör du något i stil med ".myBodyClass div.rightColumn #myHeader" så blir det mycket långsammare än att komma åt #myHeader direkt. Anledningen är att en effektiv getElementByClassName normalt sätt inte finns i js-implementationerna samt att alla browsers verkar ha optimerat för getElementById.

Att i detta fallet lägga till en id="upgrade" och använda den istället för input[name=upgrade] skulle förmodligen vara minst 5 gånger snabbare, trots att det sämre beskriver vägen till elementet. Browsers traverserar helt enkelt inte ett dokument i sin helhet för alla typer av selektorer.

Citat:

Originally posted by Clarence@Jun 28 2009, 00:50
Logiskt sett kan jag tycka att du borde ha rätt, men ofta är det faktiskt tvärtom. Så länge man använder taggnamn eller IDs innan en attribut-selektor har du rätt. Men gör du något i stil med ".myBodyClass div.rightColumn #myHeader" så blir det mycket långsammare än att komma åt #myHeader direkt. Anledningen är att en effektiv getElementByClassName normalt sätt inte finns i js-implementationerna samt att alla browsers verkar ha optimerat för getElementById.

Man borde inte behöva förklara att unika id:n alltid kommer vara snabbare - det borde säga sig självt. Varför först söka i DOM-trädet när man vet det unika id:t?

Det kanske inte är så självklart som jag trodde och då är det bara bra att du klargjorde det. :)

Tack, helt rätt anmärkning. Ang. det andra antar jag att jag ville få det att fungera och inte tänkte så mycket på vad det bästa var, men jag skall optimera det nu!

Citat:

Ursprungligen postat av dAEk

Citat:

Ursprungligen postat av Clarence

Man borde inte behöva förklara att unika id:n alltid kommer vara snabbare - det borde säga sig självt. Varför först söka i DOM-trädet när man vet det unika id:t?
Det kanske inte är så självklart som jag trodde och då är det bara bra att du klargjorde det.

Nja, det var väl mest formuleringen som blev lite fel.