2010-09-15 2 views
12

J'utilise la fonction jQuery style CSS pour certains élémentsjQuery CSS() pour les éléments créés dynamiquement

$element.css(style); 

Cela fonctionne, mais une partie des éléments sont créés dynamiquement après la charge de page. Cela devrait être

$element.live ('created',function() { 
$(this).css(style); 
}); 

Je suis bloqué sur l'événement créé. Des idées?

+0

Comment les éléments sont-ils créés? Ne pouvez-vous pas simplement utiliser une classe CSS? –

+0

J'utilisais et je voulais passer à une solution moins classe. –

Répondre

20

Il n'y a aucun événement pour les éléments créés (pas universellement disponibles, de toute façon). Vous pouvez

  • Ajouter les règles à une feuille de style afin qu'ils soient automatiquement appliqués aux éléments nouvellement créés
  • Chain la css() méthode lorsque vous créez vos éléments:

    $('<img id="createdImage" src="some.jpg"/>') 
        .appendTo(document.body) 
        .css(style); 
    
  • Créer dynamiquement une nouvelle feuille de style:

    $("<style>").text("#myNewEl { width:20px; height:30px; }").appendTo("head"); 
    
+0

J'utilisais une feuille de style et ce que je voulais faire était de m'en débarrasser (moins de fichiers) et d'utiliser CSS depuis son CSS en ligne. –

+4

@Omar inline CSS est une très mauvaise idée en général. Il n'y a rien de mal à avoir un fichier CSS avec vos styles. En fait, c'est bénéfique parce que les utilisateurs vont le télécharger une fois et il devrait être mis en cache sur les pages suivantes. Bien que je devrais dire, CSS en ligne est bien quand vous devez le faire dynamiquement, par exemple. vous ne connaissez pas la largeur/hauteur requise d'un élément à l'avance. – DisgruntledGoat

+0

@OmarAbid, vous pouvez simplement spécifier des classes dans HTML qui peuvent avoir ou non des définitions CSS dans votre fichier CSS. Jquery ne fonctionne pas en fonction des définitions de ces classes. – KBN

0
$('head').append(' 
<style> 
.folder { background: url(../icons/Folder_icons/g/f.png) no-repeat left top;} </style >'); 
Questions connexes