Supprimer le CSS d'une div en utilisant JQuery

Question

Dans mon application j'ai ce qui suit :

$("#displayPanel div").live("click", function(){
  $(this).css({'background-color' : 'pink', 'font-weight' : 'bolder'});
});

Lorsque je clique sur un Div, la couleur de ce Div est changée. Au sein de cette fonction de clic j'ai quelques fonctionnalités à faire. Après tout cela, je veux supprimer le Css appliqué au Div. Comment pourrais-je le faire en JQuery ?

Answer 1

Comme note, en fonction de la propriété, il est possible de la définir sur automatique.

Answer 2

En fait, la meilleure façon que j'ai trouvée de faire cela lorsque vous devez effectuer un stylisme complexe basé sur jquery, par exemple, si vous avez une modale que vous devez afficher mais vous devez calculer les décalages de page pour obtenir les paramètres corrects, ces valeurs devront être placées dans une fonction jQuery("x").css({}).

Donc voici le réglage des styles, la sortie des variables qui ont été calculées en fonction de divers facteurs.

$(".modal").css({ border: "1px solid #ccc", padding: "3rem", position: "absolute", zIndex: 999, background: "#fff", top: "30", visibility: "visible"})

Pour effacer ces styles, plutôt que de définir quelque chose comme

$(".modal").css({ border: "", padding: "", position: "", zIndex: 0, background: "", top: "", visibility: ""})

La manière simple serait

$(".modal").attr("style", "")

Lorsque jQuery manipule les éléments dans le DOM, les styles sont écrits dans l'élément dans l'attribut "style" comme si vous écriviez les styles en ligne. Il vous suffit de effacer cet attribut et l'élément devrait réinitialiser à ses styles d'origine.

J'espère que cela vous aidera

Answer 3

Définir la valeur par défaut, par exemple:

$(this).css("height", "auto");

ou dans le cas d'autres fonctionnalités CSS

$(this).css("height", "inherit");

Answer 4

J'ai le même problème aussi, il suffit de supprimer la valeur

      $("#play").toggle(function(){$(this).css("background","url(player.png) -100px 0px no-repeat");},
      function(){$(this).css("background","");});

Answer 5

Si vous ne voulez pas utiliser de classes (ce que vous devriez vraiment faire), le seul moyen d'accomplir ce que vous voulez est de sauvegarder d'abord les styles changés :

var oldFontSize = $(this).css("font-size");
var oldBackgroundColor = $(this).css("background-color");

// définir le style
// faites ce que vous avez à faire

$(this).css("font-size",oldFontSize);
// etc...