Avatar billede newcoma Nybegynder
04. marts 2011 - 13:59 Der er 10 kommentarer og
1 løsning

jQuery udskifte klasse

Følgende script sætter klassen 'active' på elementet 'layer' og fjerner den på andre elementer med klassen 'layer'. Den skal dog ikke fjerne klassen 'active' hvis den har det i forvejen. Nogen der kan hjælpe?

$(".layer").click(function() {
        if(!$(this).hasClass("active")) {
        var $plbn = $(".active");
          if($plbn.length != 0) {
            $plbn.click();
          }
        }
        $(this).toggleClass("active");
      });
HTML
<ul>
<li class="layer active"></li>
<li class="layer"></li>
<li class="layer"></li>
</ul>
Avatar billede aaberg Nybegynder
04. marts 2011 - 14:32 #1
Jeg forstår ikke helt det script du har lavet!

Kan du ikke bare gøre sådan?

$(".layer").click(function() {
    $(".layer").removeClass("active");
    $(this).addClass("active");
});
Avatar billede phillips Nybegynder
04. marts 2011 - 14:32 #2
Er det sådan her, du mener?

$(".layer").click(function() {
        var isActive = $(this).hasClass("active") ? 1 : 0;
        $(".layer").removeClass("active");
        $(this).addClass("active");
});
Avatar billede phillips Nybegynder
04. marts 2011 - 14:33 #3
PS: Jeg var for sent ude. Min første linie (med isActive) er for at illustrere, hvordan du kan tjekke om et element har en særlig class, og at du kan bruge den info senere ;)
Avatar billede aaberg Nybegynder
04. marts 2011 - 14:40 #4
Mit foreslag vil altid bare fjerne active-klassen fra alle layer elementer, og derefter tilføje klassen til det elementet der er trykket på.

Men du kan godt tjekke på om den er aktiv fra før, og da ikke gøre noget.

$(".layer").click(function() {
        var isActive = $(this).hasClass("active");
        if (!isActive){
            $(".layer").removeClass("active");
            $(this).addClass("active");
        }
});
Avatar billede phillips Nybegynder
04. marts 2011 - 14:47 #5
Jeg ville køre med aaberg's første forslag, da det er det korteste - lige med den her funktion, er performance-effekten nok minimal ;-)
Avatar billede phillips Nybegynder
04. marts 2011 - 14:48 #6
Med mindre du har virkelig mange punkter på listen. Så skal der nok bruges eksemplet fra #4.
Avatar billede newcoma Nybegynder
04. marts 2011 - 15:08 #7
Tusind tak. Det virker med #1. hvordan kalder jeg den samme funktion med forskellige parametre? Jeg skal bruge den med andre navne end 'layer'...
Avatar billede aaberg Nybegynder
04. marts 2011 - 15:28 #8
Du kan eventuelt lave en funktion som registrerer eventet.

function registerSelectableList(className){
    $("." + className).click(function() {
        $("." + "className").removeClass("active");
        $(this).addClass("active");
    });
}

for hver liste der skal kunne klikkes, kalder du funktionen:

registerSelectableList("layer");
registerSelectableList("layer2");
registerSelectableList("layer3");
Avatar billede newcoma Nybegynder
04. marts 2011 - 16:40 #9
Perfekt aaberg_cc smid et svar : )
Avatar billede aaberg Nybegynder
04. marts 2011 - 17:45 #10
svar :)
Avatar billede aaberg Nybegynder
04. marts 2011 - 17:46 #11
jeg prøver igen. svar :)
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