2012-07-30 15 views
5

Sto provando ad applicare uno stile dinamicamente ad alcuni elenchi a discesa nella mia pagina. L'uso di jQuery addClass aggiunge effettivamente la classe a tutti gli elementi "Seleziona", come posso vedere dalla mia console di Chrome. Tuttavia, gli stili non sono applicati agli elementi.jQuery addClass non applica lo stile dinamicamente

Ora, se aggiungo manualmente la classe a ogni elemento selezionato singolarmente, quindi salva la pagina e la aggiorna, lo stile viene applicato all'elemento.

Qualche idea sul perché lo stile non viene applicato con l'iniezione di classe jQuery?

$("select").addClass("select js-select"); 
+0

Puoi pubblicare un esempio su jsFiddle? – j08691

+0

Potresti pubblicare un esempio di HTML e CSS? – hradac

+0

Si prega di inviare un violino. Aiutaci ad aiutarti! – SexyBeast

risposta

2

Hai detto che gli stili non sono applicati, ma le classi "seleziona js-select" sono aggiunte agli input selezionati? Quindi ci deve essere qualche problema con il css o forse il browser.

$ ("select"). AddClass (..) dovrebbe funzionare, non è obbligatorio specificare per ID o classe.

+0

Hai ragione, quando ho capito che stava effettivamente prendendo di mira l'elemento select. – Chris

+0

Questo è ora risolto. Ecco il violino con l'iniezione che funziona correttamente. Il problema era con il css e include javascript. Non funzionavano correttamente quando li aggiungevano come risorse nel violino, tuttavia quando li aggiungi come collegamenti, funziona perfettamente. Fiddle: [link] (http://jsfiddle.net/5qKV2/) –

+0

Quindi tutto funziona adesso? Felice di aiutare ;). – LazyTarget

2

Questo esempio funziona:

<p><a href="#" id="clicker">Add Class</a></p> 
<div id="select">Hello World</div> 

javascript

$("#clicker").click(function() { 

    $("#select").addClass("select js-select"); 
}); 

Guardando il codice, sembra che il $ ("select") dovrebbe disporre di un ID o selettore di classe su di essa. Avendo uno di questi selettori, il tuo codice conoscerà l'obiettivo su cui applicare gli stili. Altrimenti il ​​tuo codice funziona bene.

Buona fortuna, e spero che questo aiuti.

+0

Ecco il jsfiddle, spero che voi ragazzi potete darmi una mano: [link] (http://jsfiddle.net/gc3wQ/2/) –

0

Funziona correttamente se si modifica onDomReady su onLoad. Come in http://jsfiddle.net/gc3wQ/9/

+0

Ancora non funziona. Gli stili applicati sono piuttosto notevoli e sarebbero molto evidenti. Vedo che l'uso di "onLoad" sta iniettando le classi, tuttavia gli stili non sono applicati. Tuttavia, se si mettono manualmente le classi negli elementi select, vengono applicati gli stili. –

+0

Ora funziona, ma non solo in jsFiddle. http://jsfiddle.net/gc3wQ/11/ Prendere l'abitudine di avvolgere tutto il codice jQuery a fianco di: $ (documento) .ready (function() { }); Vedi anche: http://docs.jquery.com/Tutorials:Introducing_%24%28document%29.ready%28%29 – LazyTarget

+0

Stai vedendo gli stili applicati nel violino? Non li vedo ancora. Per prima cosa aggiungi gli stili manualmente, per avere un'idea degli stili che sto cercando di iniettare. Sto iniettando questi stili in una forma dinamica sulla mia pagina, quindi, teoricamente, se posso iniettare gli stili in elementi selezionati che creo sul dom, dovrei essere in grado di iniettare anche gli stili su elementi creati dinamicamente. –

Problemi correlati