web-dev-qa-db-fra.com

Rendre un bouton invisible en cliquant sur un autre bouton en HTML

Comment rendre un bouton invisible en cliquant sur un autre bouton au format HTML?
J'ai écrit comme ci-dessous, mais cela ne fonctionne pas.

<input type="button" onclick="demoShow();" value="edit" />
<script type="text/javascript"> 
    function demoShow()
    { document.getElementsByName('p2').style.visibility="hidden"; }
</script>
<input id="p2" type="submit" value="submit" name="submit" />
javascripthtmlvisibilityhidden
5
Nasrin hakim Mithila

écrire cela

Cacher

{document.getElementById("p2").style.display="none";}

montrer

{document.getElementById("p2").style.display="block";}
10
Sonal Khunt

Pour visible: 

document.getElementsById("test").style.visibility="visible";

Pour Invisible: 

document.getElementsById("test").style.visibility="hidden";
2
Ranga Reddy

  1. getElementById renvoie un seul objet pour lequel vous pouvez spécifier le style.Ainsi, l'explication ci-dessus est correcte.

  2. getElementsByTagName renvoie plusieurs objets (tableau d'objets et propriétés) pour lesquels nous ne pouvons pas appliquer directement le style.

2
Umesh Patil

Utilisez la id de l'élément pour faire la même chose.

document.getElementById(id).style.visibility = 'hidden';
1
check123

essaye ça

function demoShow() {   
document.getElementById("but1").style.display="none";

}



<input type="button" value="click me" onclick="demoShow()" id="but" />

<input type="button" value="hide" id="but1" />
1
Mr.T.K

Essaye ça

<input type="button" onclick="demoShow()" value="edit" />
<script type="text/javascript"> 
function demoShow()
{p2.style.visibility="hidden";}
</script>
<input id="p2" type="submit" value="submit" name="submit" />

http://jsbin.com/gurolawu/1/

0
nimday
$( "#btn1" ).click(function() {
 $('#btn2').css('display','none');
});
0
Neminath

Pour obtenir un élément par son ID, utilisez ceci:

document.getElementById("p2")

Au lieu de:

document.getElementsByName("p2")

Donc, le produit final serait:

document.getElementsById("p2").style.visibility = "hidden";
0
JCOC611

Utiliser jQuery!

var demoShow = function(){
    $("#p2").hide();
}

Mais je vous recommanderais de donner à votre bouton un identifiant sur lequel vous souhaitez qu'une action se produise. Par exemple:

<input type="button" id="p1" value="edit" />
<input type="button" id="p2" value="submit" name="submit" />

<script type="text/javascript"> 
$("#p1").click(function(){
    $("#p2").hide();
});
</script>

Pour le montrer à nouveau, vous pouvez simplement écrire: $("#p2").show();

0
Harsh Vardan Gupta

Utilisez ce code:

<input type="button" onclick="demoShow()" value="edit" />
<script type="text/javascript"> 
function demoShow()
{document.getElementById("p2").style.visibility="hidden";}
</script>
<input id="p2" type="submit" value="submit" name="submit" />
0
NavaStha

J'ai rencontré des problèmes avec les éléments déplacés en utilisant certains des éléments ci-dessus, donc si vous avez des objets côte à côte que vous voulez simplement échanger, cela fonctionnera mieux pour moi.

document.getElementById('uncheckAll').hidden = false;
document.getElementById('checkAll').hidden = true;
0
Gavin Mannion