JavaScript - funcion reutilizable

 
Vista:
sin imagen de perfil
Val: 41
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

funcion reutilizable

Publicado por Alejandro (24 intervenciones) el 26/03/2020 19:07:37
Hola bueno dias,

vereis tengo una funcion javascript la cual cuando hago click en un option de un select muestra un div, si no esta seleccionado ese option desaparece el div. Lo que quiero es que esa funcion se reutilizable a cualquier lista select, ya que solo puedo usarlo para este caso con este div.
A continuacion os dejo el codigo de mi funcion:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function divSelect (id) {
 
	if (id == "si") {
 
		document.getElementById("divSelect").style.display="block";
		document.getElementById("divSelect").style.width="800px";
 
 
 
	}else{
 
		document.getElementById("divSelect").style.display="none";
 
	}
 
}

Y aqui el codigo html:

1
2
3
4
5
6
7
8
9
10
11
<select name="prestaciones" id="prestaciones" onclick="divSelect(this.value);" >
    <option value="si">Si</option>
    <option selected >No</option>
</select>
 
    <div id="divSelect">
 
         //este es el div que se muestra
 
    </div>
</select>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 40
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

funcion reutilizable

Publicado por Marlon (90 intervenciones) el 27/03/2020 07:41:44
Creo que esto es lo que necesitas.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<select name="prestaciones" id="prestaciones" onchange="divSelect(this);" >
        <option>Si</option>
        <option selected >No</option>
	</select>
	<div id="div_prestaciones">
	 	MOSTRAR DIV PRESTACIONES
	</div>
	<select name="prestaciones" id="aumento" onchange="divSelect(this);" >
        <option>Si</option>
        <option selected >No</option>
	</select>
	<div id="div_aumento">
	 	MOSTRAR DIV AUMENTO
	</div>
	<select name="prestaciones" id="regalia" onchange="divSelect(this);" >
        <option>Si</option>
        <option selected >No</option>
	</select>
	<div id="div_regalia">
	 	MOSTRAR DIV REGALIA
	</div>
</select>
 
<script type="text/javascript">
 
	function divSelect (select) {
		if (select.value == "si") {
			document.getElementById("div_"+select.id).style.display="block";
			document.getElementById("div_"+select.id).style.width="800px";
		}else{
			document.getElementById("div_"+select.id).style.display="none";
		}
	}
</script>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 40
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

funcion reutilizable

Publicado por Marlon (90 intervenciones) el 28/03/2020 01:27:46
Que no te funciona?.
Que error te arroja la consola?
como lo estas implementando?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 41
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

funcion reutilizable

Publicado por Alejandro (24 intervenciones) el 05/04/2020 17:59:18
Esto es lo que tengo en mi pagina html:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<select name="prestaciones" id="prestaciones" onchange="divSelect(this);" >
    <option >Si</option>
    <option selected >No</option>
</select>
 
<div id="div_prestaciones">
 
    <label>Tipo:</label>
    <select name="tipoPrestacion">
        <option selected>--No seleccionado--</option>
        <option>Prestacion por desempleo</option>
        <option>Subsidio por desempleo</option>
        <option>Discapacidad</option>
        <option>Renta garantizada</option>
        <option>Otros</option>
    </select>
    <label>Descripción:</label><textarea cols="45" name="desPrestacion"></textarea>
 
</div>

Y esta la funcion:

1
2
3
4
5
6
7
8
9
function divSelect (select) {
 
	if (select.value == "si") {
		document.getElementById("div_"+select.id).style.display="block";
		document.getElementById("div_"+select.id).style.width="800px";
	}else{
		document.getElementById("div_"+select.id).style.display="none";
	}
}

Tambien he decir que los div no muestran lo mismo, muestra cosas diferentes, entonces el value=si no serviria para todo.

Cuando cargo la pagina el div se muestra y deberia estar oculto hasta que seleccione el Si, cuando selecciono si, se oculta el div y luego ya no hay manera de que vuelva a mostrarse
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 41
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

funcion reutilizable

Publicado por Alejandro (24 intervenciones) el 20/04/2020 12:34:43
ya esta, no era un error era que no refrescaba bien la pagina con F5. Asi que funciona perfecto
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar