JavaScript/25.control.checkbox_2_js.html at master · schtiell/JavaScript · GitHub

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
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Control Checkbox JavaScript</title>
</head>
<body>

	<h1>Control Checkbox JavaScript</h1>

	<p><strong>Ejercicio: </strong> <br>Confeccionar una página que muestre tres checkbox que permitan seleccionar los deportes que practica el usuario (Fútbol, Básket, Tenis) Mostrar al presionar un botón los deportes que eligió. </p>

	<hr>

	<script>

		function imprimirDeportes () {

			var futbol = document.getElementById('futbol');
			var basket = document.getElementById('basket');
			var tenis = document.getElementById('tenis');

			var deportes = '';

			if (futbol.checked){
				deportes = deportes +'futbol';
			}

			if (basket.checked){
				deportes = deportes +' basket';
			}

			if (tenis.checked){
				deportes = deportes +' tenis';
			}

			alert('Los deportes que te gustan son: ' + deportes);

		}

	</script>

	<h2>Selecciona los deportes que prefieres:</h2>

	<form action="">
		<label for="">futbol</label>
		<input type="checkbox" id="futbol"><br>
		<label for="">basketball</label>
		<input type="checkbox" id="basket"><br>
		<label for="">Tenis</label>
		<input type="checkbox" id="tenis"><br>

		<input type="button" value="Enviar" onclick="imprimirDeportes()">
	</form>


</body>
</html>