Maison > Article > interface Web > Contrôles JS masqués et affichés

Contrôles JS masqués et affichés

不言original: 2018-04-26 14:29:111733parcourir

Cet article partage avec vous un code JS relativement simple pour contrôler l'affichage caché. Les amis dans le besoin peuvent y jeter un œil

Une implémentation relativement simple de style.display consiste à contrôler l'affichage caché Ou. l'attribut affiché. La

<html>
<body>
<script>
function show(){
document.getElementById("p").style.display="";
//alert(document.getElementById("p").style.display)
}
function hidden(){
document.get
ElementById("p").style.display="none";
//alert(document.getElementById("p").style.display)
}
</script>
<BODY>
<input name="name" type="button" onClick="show();" value="显示">
<p id="p" style="display: none" onMouseout="hidden();">
show it
</p>
</BODY>
</HTML>

p visibilité peut contrôler l'affichage et le masquage de p, mais la page apparaîtra vide après le masquage

style="visibility: none;"
document.getElementById("typep1").style.visibility="hidden";//隐藏
document.getElementById("typep1").style.visibility="visible";//显示

En définissant l'attribut d'affichage, vous pouvez libérer l'espace de page occupé une fois que p est masqué , comme suit

style="display: none;"
document.getElementById("typep1").style.display="none";//隐藏
document.getElementById("typep1").style.display="";//显示

Si vous utilisez p.style.display="none" pour le masquer, les éléments de p seront mis en veille et les événements l'intérieur ne répondra pas

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Framework js frontal AngularJSArticle suivant：Framework js frontal AngularJS

Articles Liés

Voir plus