web-dev-qa-db-fra.com

retirer l'attribut display: none; donc l'article sera visible

L'élément est:

span    {
    position:absolute;
    float:left;
    height:80px;
    width:150px;
    top:210px;
    left:320px;

    background-color:yellow;

    display:none;                 //No display                  
    border: 3px solid #111;
}

J'utilise ce code pour supprimer l'affichage afin qu'il puisse être visible,

$ ("span"). removeAttr ("display");

mais ça ne marche pas. La méthode que j'utilise est-elle valide ou existe-t-il un autre moyen d'obtenir le résultat?

32
mt0s

$("span").show() devrait suffire.

48
Nikita Rybak

La fonction removeAttr() supprime uniquement les attributs HTML. La display n'est pas un attribut HTML, c'est une propriété CSS. Vous souhaitez plutôt utiliser css() function pour gérer les propriétés CSS.

Mais jQuery offre une fonction show() qui fait exactement ce que vous voulez dans un appel concis:

$("span").show();
12
BalusC

Vous devez supprimer l'attribut "style" au lieu de la propriété "display":

$("span").removeAttr("style");
4
Beedjees

Si vous envisagez de masquer une partie de la durée en fonction de l'événement click qui est initialement masqué avec style = "display: none", l'option .toggle () est préférable.

$ ("span"). toggle ();

Motifs: À chaque fois, vous n'avez pas besoin de vérifier si le style existe déjà ou non. .toggle () se chargera de cela automatiquement et affichera/affichera une plage en fonction de l’état actuel.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="Toggle" onclick="$('#hiddenSpan').toggle();"/>
<br/>
<br/>
<span id="hiddenSpan" style="display:none">Just toggle me</span>

0
J-D

Le jQuery que vous utilisez est le DOM, pas le CSS lui-même. Essayez de remplacer Word span dans votre CSS par .mySpan, puis appliquez cette classe à un ou plusieurs éléments DOM de votre code HTML, comme suit:

...
<span class="mySpan">...</span>
...

Ensuite, changez votre jQuery comme suit:

$(".mySpan").css({ display : inline });

Cela devrait fonctionner beaucoup mieux.

Bonne chance!

0
mkoistinen