2013-07-14 4 views
4

Je veux changer une entrée html invisible en visible quand je clique sur un bouton comme montré ci-dessous. Ma ligne de HTML qui crée l'entrée cachée est:Rendre l'entrée cachée html visible

<input type="hidden" id="txtHiddenUname" value="invalid input" /> 

mon script java pour changer la visibilité est

var y = document.getElementById("txtHiddenUname"); 
y.style.display= "inline"; 

Mais ce ne pouvait pas faire l'élément caché soit visible. Des idées?

+0

Vous devez changer la valeur à "entrée valide", sinon elle n'est pas valide? – adeneo

Répondre

6

Vous devez modifier le type d'élément d'entrée comme:

y.setAttribute('type','text'); 
//or 
y.type = 'text'; 

1) Soit java script utilisateur à l'intérieur de la balise body comme ci-dessous:

<input type="hidden" id="txtHiddenUname" value="invalid input" /> 

<script type="text/javascript"> 
var y = document.getElementById("txtHiddenUname"); 
y.type= "text"; 
</script> 

OU

2) Utilisez un gestionnaire d'événements tel que onload

<head> 
<script type="text/javascript"> 
function on_load(){ 
    var y = document.getElementById("txtHiddenUname"); 
    y.type= "text"; 
} 
    </script> 
</head> 

<body onload = "on_load()"> 

<input type="hidden" id="txtHiddenUname" value="invalid input" /> 

... 

afin que le DOM soit prêt.

+0

Je l'ai essayé et en effet il rend le texte visible. mais la visibilité reste en millisecondes et retourne en mode invisible. – kona

+0

utilisez ce code après que certains événements se soient produits sur un élément, comme un clic sur un bouton ou quelque chose d'autre. – Lekhnath

2

ici n'est pas question de CSS, il est question d'attributs, vous devez donc changer l'attribut type de hidden à quelque chose d'autre comme text

Veuillez vérifier [comment-changement-html-objet element- data-attribute-value-in-javascript] [1]

vérifiez ceci: How to change HTML Object element data attribute value in javascript. Pour changer la valeur de l'attribut en utilisant jQuery ou Javascript

0
<input type = "hidden", id = "abbriv", value = "Some Random Text"/> 

<script> 
     function f1() 
     { 
      var x = document.getElementById("abbriv").value; 
      document.getElementById("demo").innerHTML = x; 
     } 
    </script> 
+0

Veuillez fournir quelques explications concernant votre réponse quant à ce qui se passe exactement de sorte que lorsque quelqu'un lit ceci, il a une compréhension claire/meilleure. – Rikh

Questions connexes