Classe Css ajoutée mais non rendue lorsqu'elle est appliquée avec jQuery

Question

Je rencontre un problème particulier. Je suis capable d'ajouter une classe css à un DIV, mais les styles ne sont pas rendus.

MISE À JOUR

J'ai finalement trouvé le problème.

Avec le code que j'ai utilisé à l'origine, j'ai ajouté la classe à la div 'myDialog'. Ce que j'ai dû faire, c'était d'ajouter la classe à la div parente que $ .dialog crée (pour envelopper mon div de dialogue).

Une fois que cela a été fait, mon DialogBox a été rendu corectly. Voici le code que j'utilise:

//Instantiate dialog  
    jQuery("#dialog").dialog({ modal:true, autoOpen:false }); 

    function processRegistration(instanceID, formData) 
    { 
    jQuery.post("wp-content/themes/storelocator/include/jquery_bll.php", { instance: 'processRegistration', formData : formData, instanceID : instanceID }, 
     function(feedback) 
     { 
     jQuery('#dialog').text(feedback.message); 
     jQuery('#dialog').parent().addClass(feedback.type); 
     jQuery('#dialog').dialog('open'); 
     },"json"); 
    } 

Answer 1

Couple de choses à regarder dehors pour qui me mordent constamment lorsque vous faites des styles dynamiques comme ceci:

1) Assurez-vous que votre fichier CSS est inclus APRÈS jQuery de et/ou quels que soient les fichiers de thème que vous utilisez. Ils pourraient remplacer votre style, et le dernier fichier à inclure est celui qui "gagne" les conflits de style.

2) Assurez-vous que votre style est en fait valide et être inclus. Appliquez-le à un élément statique et assurez-vous qu'il ressemble à ce que vous attendez. J'ai remarqué dans le CSS que vous avez montré que vous avez un "'" avant #dialog et pas de fermeture "}" sur le style de dialogue .ui, les deux pouvant casser le fichier dans son ensemble. Je devine que ce n'était qu'un copier-coller, mais vous devriez vérifier au cas où. J'ai eu de nombreux cas où je pensais que jQuery était en train de tuer mon style pour découvrir que le style était cassé depuis le début, ou que je l'avais mis dans un fichier qui n'était même pas inclus.

Oh! Hey! Une autre chose que je viens de remarquer. VOUS êtes en train d'écraser votre style d'échec! Essayez de déplacer votre style de boîte de dialogue .ui au-dessus de votre style .fail dans le CSS et voyez si vous obtenez des résultats différents. Votre style de boîte de dialogue .ui peut réinitialiser l'arrière-plan à transparent. Rappel: en CSS le dernier style défini gagne toujours!

Answer 2

Pour être précis, le barré dans la liste CSS Firebug ne signifie pas tout à fait que les styles sont "annulés"; cela signifie qu'ils ont été remplacés par un autre style ailleurs. Quoi que ce soit devrait également apparaître dans la liste. Il semble qu'une classe soit appliquée comme prévu, mais n'a pas l'effet escompté, car il existe un style plus spécifique appliqué dans un autre style de CSS ou dans un style explicitement appliqué aux éléments.