JavaScript - habilitar a través de click en ckeckbox

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

habilitar a través de click en ckeckbox

Publicado por Nicolás (5 intervenciones) el 09/09/2016 18:30:15
Hola. Estoy creando un código para habilitar elementos DOM a través de ckeckboxs.
Logré la primera parte: habilitar elementos DOM a través del click en un checkbox, pero no logró deshabilitar esos elementos cuando el checkbox deja de estar checkeado. Agradezco cualquier sugerencia.
Gracias.

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
44
45
46
47
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8"/>
		<title>test</title>
    </head>
    <body>
        <div class="c">
        <input type="checkbox" name="cb" id="elegir1" value="value1"><br>
        <input type="checkbox" name="cb" id="elegir2" value="value2"><br>
        </div>
 
            <div class="d">
            First name: <input type="text" name="fname" disabled><br>
            Middle name: <textarea name="mname" disabled></textarea>
            </div>
 
            Last name: <input type="text" name="lname" id="lnamex" disabled><br>
 
<script>
    var inputs = document.querySelectorAll('input[type="checkbox"]');
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].onclick = function() {
            if (this.value == 'value1') {
                en();
            } else {
                dis();
            }
        }
    }
 
    function en() {
    var element1 = document.querySelectorAll('.d input[type=text], .d textarea');
    for (var i = 0; i < element1.length; i++) {
        element1[i].disabled = false;
    }
    }
 
    function dis() {
    var element2 = document.querySelectorAll('.d input[type=text], .d textarea');
    for (var i = 0; i < element2.length; i++) {
        element2[i].disabled = true;
    }
    }
</script>
	</body>
</html>
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
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

habilitar a través de click en ckeckbox

Publicado por xve (2100 intervenciones) el 10/09/2016 13:21:48
Hola Nicolás, no has generado ningun evento!!! por lo que por mucho que pulse, no ara nada!!!

No se como tienen que funcionar los check... pero mira este ejemplos que te he preparado:
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8"/>
		<title>test</title>
    </head>
    <body>
        <div class="c">
        <input type="checkbox" name="cb" id="elegir1" value="value1"><br>
        <input type="checkbox" name="cb" id="elegir2" value="value2"><br>
        </div>
 
            <div class="d">
            First name: <input type="text" name="fname" disabled><br>
            Middle name: <textarea name="mname" disabled></textarea>
            </div>
 
            Last name: <input type="text" name="lname" id="lnamex" disabled><br>
 
<script>
	var elemento=document.querySelectorAll('input[type="checkbox"]');
	if (elemento[0].addEventListener)
	{
		// Para todos los navegadores que siguen los estándares
		for(var i=0;i<elemento.length;i++)
		{
			elemento[i].addEventListener("click",miFuncion,false);
		}
	}else{
		// Como no, para nuestro amigo Microsoft...
		// Ellos siempre ayudando a los desarrolladores...
		for(var i=0;i<elemento.length;i++)
		{
			elemento[i].attachEvent("onclick", miFuncion);
		}
	}
 
	function miFuncion() {
		console.log(this.id);
		if(this.checked && this.id=="elegir1")
		{
			en();
		}else if(this.checked && this.id=="elegir2"){
			dis();
		}
	}
 
    function en() {
    var element1 = document.querySelectorAll('.d input[type=text], .d textarea');
    for (var i = 0; i < element1.length; i++) {
        element1[i].disabled = false;
    }
    }
 
    function dis() {
    var element2 = document.querySelectorAll('.d input[type=text], .d textarea');
    for (var i = 0; i < element2.length; i++) {
        element2[i].disabled = true;
    }
    }
</script>
	</body>
</html>

Coméntanos, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil
Val: 5
Ha aumentado su posición en 65 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

habilitar a través de click en ckeckbox

Publicado por Nicolás (5 intervenciones) el 13/09/2016 14:45:03
Ahora sí está funcionando, ya puedo habilitar los inputs.
Me falta la segunda parte, deshabiltarlos al dejar de checkear un checkbox, pero por acá va la cosa.

Muchas gracias.
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