Diferència entre revisions de la pàgina «Exercici 4 Events»

De wikiserver
Dreceres ràpides: navegació, cerca
 
(4 revisions intermèdies per un altre usuari que no es mostra)
Línia 1: Línia 1:
 
Es mostra la part corresponent al tag Script de Javascript:
 
Es mostra la part corresponent al tag Script de Javascript:
<pre>
+
<source lang="java">
 
<script type="text/javascript">
 
<script type="text/javascript">
 
window.onload=function(){
 
window.onload=function(){
document.getElementById("enlace_1").onclick=function(){ mostraOculta("contenidos_1");};
+
            document.getElementById("enlace_1").addEventListener('click', ()=>{mostraOculta("contenidos_1");}, false);
document.getElementById("enlace_2").onclick=function(){ mostraOculta("contenidos_2");};
+
            document.getElementById("enlace_2").addEventListener('click', ()=>{mostraOculta("contenidos_2");}, false);
document.getElementById("enlace_3").onclick=function(){ mostraOculta("contenidos_3");};
+
            document.getElementById("enlace_3").addEventListener('click', ()=>{mostraOculta("contenidos_3");}, false);
 
}
 
}
function mostraOculta(id){
+
function mostraOculta(id){ //e.target.id podemos obtener el id
 
var nombre = id;
 
var nombre = id;
 
var link_nombre = "enlace_" + nombre.split("_")[1];
 
var link_nombre = "enlace_" + nombre.split("_")[1];
Línia 22: Línia 22:
 
}
 
}
 
</script>
 
</script>
</pre>
+
</source>
 +
 
 +
<!--
 +
'''ALTRA FORMA'''
 +
 
 +
<source lang="java">
 +
window.onload=function(){
 +
 
 +
function muestraOculta() {
 +
            document.getElementById("contenidos_1").style="visibility:hidden";  //oculta el text
 +
            this.innerHTML="Cambiar el enlace";                                  //canvia el enllaç
 +
        }
 +
function muestraTexto() {
 +
            document.getElementById("contenidos_1").style="visibility:visible";    //mostra el text
 +
        }
 +
       
 +
document.getElementById("enlace_1").onmouseover=muestraOculta;
 +
        document.getElementById("enlace_1").onmouseout=muestraTexto;
 +
       
 +
     
 +
       
 +
}
 +
</source>
 +
->>

Revisió de 20:06, 26 gen 2024

Es mostra la part corresponent al tag Script de Javascript:

<script type="text/javascript">
	window.onload=function(){
            document.getElementById("enlace_1").addEventListener('click', ()=>{mostraOculta("contenidos_1");}, false);
            document.getElementById("enlace_2").addEventListener('click', ()=>{mostraOculta("contenidos_2");}, false);
            document.getElementById("enlace_3").addEventListener('click', ()=>{mostraOculta("contenidos_3");}, false);
	}
		function mostraOculta(id){  //e.target.id podemos obtener el id
			var nombre = id;
			var link_nombre = "enlace_" + nombre.split("_")[1];
			var parrafo = document.getElementById(nombre);
			var link = document.getElementById(link_nombre);
 			if(parrafo.style.display == "none"){
				parrafo.style.display = "block";
				link.innerHTML =  "Oculta contenido";
			}
			else{
				parrafo.style.display = "none";
				link.innerHTML =  "Muestra contenido";
			}
		}	
</script>