No me deja cambiarle el link con un if
Publicado por andrew (4 intervenciones) el 04/05/2020 01:00:15
Hola, soy nuevo en esto de la programación y estoy haciendo un pequeño programa de prueba. Mi idea esque cuando el usuario ponga su nombre en cualquiera de los dos inputs, el href del link se cambie, pero el if parece que escriba lo que escriba no me cambia el link. Espero logren ayudarme, lo agradecería mucho. Gracias
Este es el código HTML:
Este es el codigo JAVASCRIPT:
Este es el código HTML:
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bonilla Cards</title>
<link rel="stylesheet" href="styles/styles.css">
<script src="https://kit.fontawesome.com/157a0bdba1.js" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/css2?family=Bangers&display=swap" rel="stylesheet">
</head>
<body>
<header>
<div>
<h1>Bonilla Card Game</h1>
</div>
</header>
<main>
<div class="contenedor cajas">
<div class="caja1 " id="cj1">
<i class="fas fa-mars"></i>
<label id="ocultar" style="display: none;">Escribe tu nombre <input type=" text " id="in1"></label>
</div>
<div class="caja2" id="cj2">
<i class="fas fa-venus"></i>
<label id="ocultar2" style="display: none;">Escribe tu nombre <input type="text" id="in2"></label>
</div>
</div>
<div class="siguiente" id="siguiente">
<a id="link">Siguiente</a>
</div>
</main>
<script src="scripts/scripts.js"></script>
</body>
</html>
Este es el codigo JAVASCRIPT:
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
const abrirCaja1 = document.querySelector('#cj1');
const abrirCaja2 = document.querySelector('#cj2');
const siguiente = document.querySelector('#siguiente');
const nombreUsuario = document.querySelector('#in1');
const nombreUsuario2 = document.querySelector('#in2');
const valorUsuario = nombreUsuario.value;
const valorUsuario2 = nombreUsuario2.value;
let link = document.querySelector('#link');
let clickCaja1 = abrirCaja1.addEventListener('click', () => {
document.querySelector('#ocultar').style.display = "block";
});
let clickCaja2 = abrirCaja2.addEventListener('click', () => {
document.querySelector('#ocultar2').style.display = "block";
});
let siguientePagina = siguiente.addEventListener('click', () => {
if (valorUsuario === "" && valorUsuario2 === "") {
alert('Debes colocar tu nombre para continuar');
} else {
link.href = "game.html";
}});
Valora esta pregunta
0
