lo stile di jclery addclass non funziona, selettore sbagliato?
Domanda
<li id="leistungen"><a href="#Leistungen" onclick="sitemapChangeSubMenu('leistungen','leistungencontent','leistungen'); return false;">LEISTUNGEN</a> </li>
Questa è la voce di elenco con cui desidero creare uno stile:
$("#leistungen a").addClass("brown");
Questo non funziona neanche per:
$("#leistungen").addClass("brown");
il mio codice CSS è solo
.brown {
color:brown;
}
Non so cosa sia sbagliato, spero che tu mi possa aiutare :)
grazie mille!
Soluzione
Dire
$("#leistungen").addClass("brown");
funzionerà su tutto il testo all'interno di #leistungen, ma non sui tag anchor. Le ancore hanno uno stile predefinito che deve essere ignorato. Hai ragione per iscritto
$("#leistungen a").addClass("brown");
Esegui un test per assicurarti che il tuo Javascript sia in esecuzione modificandolo in
$("#leistungen a").hide();
Se scompare, allora sai che il tuo Javascript funziona sull'elemento corretto. Successivamente, prova a essere più specifico con il tuo selettore (forse qualcos'altro sta scavalcando la tua modifica).
$("li#leistungen a").addClass("brown");
Se non funziona, assicurati che javascript sia stato eseguito e quindi controlla l'elemento. Ha la nuova classe? In tal caso, il problema riguarda il CSS anziché il Javascript. Controlla il tuo file CSS che circonda la & Quot; .brown & Quot; stile per cercare errori di sintassi. Un}} mancante dello stile precedente lo farebbe.
Prova a usare " # 4C3F12 " invece della parola " brown " come colore.
.brown {
color: #4C3F12;
}
Fammi sapere se qualcuno di questi aiuti!
Altri suggerimenti
Distinzione tra maiuscole e minuscole: hai chiamato l'ancora con una L maiuscola
$("#Leistungen").addClass("brown");
Anche nel primo caso, dovresti usare un selettore di classe, non un selettore di identità
$(".leistungen a").addClass("brown");
Nota: eviterei classi e ID corrispondenti (con o senza maiuscole / minuscole).
HTML Attributo ID documenti (sottolineatura mia):
L'attributo ID identifica in modo univoco un elemento all'interno di un documento. No due gli elementi possono avere lo stesso valore ID in un singolo documento. L'attributo il valore deve iniziare con una lettera in intervallo A-Z o a-z e può essere seguito con lettere (A-Za-z), cifre (0-9), trattini (" - "), trattini bassi (" _ "), due punti (": ") e punti (". "). Il il valore fa distinzione tra maiuscole e minuscole.
Hai installato firebug? In firebug dovrai verificare se la classe viene aggiunta o meno. Se viene aggiunto, aggiorna la cache del browser, altrimenti controlla il tuo javascript.
Potresti avere un problema con Specificità CSS qui. Se il colore originale del tag "a" è specificato in modo molto specifico, la nuova definizione potrebbe non funzionare. Ad esempio:
body #leistungen a {
color: red;
}
.brown {
color: brown;
}
In questo caso il colore rosso ha la precedenza sul colore marrone, perché la prima definizione è più specifica dell'ultima. Prova a definire la classe marrone in modo più specifico:
body #leistungen a.brown {
color: brown;
}
È possibile che tu abbia una definizione CSS in conflitto da qualche parte. Se sei sicuro che il javascript sia in esecuzione, controlla questo:
- Poiché si tratta di un ID, assicurarsi che tale ID non sia assegnato anche a un altro tag.
- Hai altre dichiarazioni css che si applicano ai tag?
Prova a cambiare la dichiarazione in:
a.brown{ color: brown;}
O .brown a {color: brown;}
A seconda se si utilizza $("#leistungen a").addClass("brown");
o $("#leistungen").addClass("brown");