0

Hola buenas soy nuevo en esto, no caigo en como hacer que un boton de un premio, otro un desastre(terremoto), y seria del 1 al 5 de forma aleatoria, es para un juego, ambos no se pueden repetir, vamos que aleatoriamente nunca los dos botones den el mismo valor. Gracias

let buttons = document.getElementsByTagName('button');
let price = Math.floor(Math.random() * buttons.length) + 1;
let earthquake = price;

while(price == earthquake){
  earthquake = Math.floor(Math.random() * buttons.length) + 1;
}

let premioBoton = document.getElementsByTagName('button')[price - 1];
let earthquakeBoton = document.getElementsByTagName('button')[earthquake - 1];

premioBoton.onclick = function(){
  alert('Ha ganado un premio de $ 10.000');
};

earthquakeBoton.onclick = function(){
  alert('Ha habido un terremoto')
};
let buttons = document.getElementsByTagName('button');
let price = Math.floor(Math.random() * buttons.length) + 1;
let earthquake = price;

// if (opener === null) {
//   alert('Pasa primero por el panel generl')
//   location.assign("../index.html");
// }

while(price == earthquake){
  earthquake = Math.floor(Math.random() * buttons.length) + 1;
}
console.log('earthquake is in ' + earthquake);
console.log('price is in ' + price);

1 respuesta 1

0

Podría validar luego de obtener el premio que no se repita con earthquake empleando una estructura while

let buttons = document.querySelectorAll('button');
let price = Math.floor(Math.random() * buttons.length) + 1;
let earthquake = price; // Igualamos
// Mientras sea igual ejecutamos nuevamente el random
while(earthquake=== price){
    earthquake = Math.floor(Math.random() * buttons.length) + 1;

}

console.log(' price is in ' + price);
console.log(' earthquake is in ' + earthquake);

//Iteramos sobre los botones
buttons.forEach(function(el) {
    // agregamos el listener, para el evento click
    el.addEventListener('click',function(e){
        // si es el valor generado price igual al atributo de
        // data-num del botón es premiado
        if(this.getAttribute('data-num') == price){
            alert("Premiado");
        }
        // si es el valor generado earthquake igual al atributo de
        // data-num del botón es terremoto
        if(this.getAttribute('data-num') == earthquake){
            alert("Terremoto");
        }
    });
});
<h1>¡Bienvenido!</h1>

<p>Realiza un sorteo cada hora y podrás ganar 10.000$... ¡o un terrible terremoto!</p>

<h2>¿A qué número apuestas?</h2>

<button data-num="1">1</button>
<button data-num="2">2</button>
<button data-num="3">3</button>
<button data-num="4">4</button>
<button data-num="5">5</button>


<div id="alerta"></div>

5
  • muchas gracias, pero como seria para si cliqueo en el numero premiado me salga algo y si en terremoto salga otra cosa, se que es super sencillo pero no caigo Commented el 21 ene. 2018 a las 19:31
  • @franciscodwq actualicé mi respuesta. comente si funciono mi respuesta y si tiene dudas también. Saludos
    – Dev. Joel
    Commented el 21 ene. 2018 a las 19:42
  • yo tambien pero de manera rudimentaria, querria verlo pero sin forEach no habria forma? la mia tengo los eventos de botones por separado, no hay una forma mas compacta siguiendo mi estilo? Soy nuevo en esto perdona :( Commented el 21 ene. 2018 a las 19:47
  • @franciscodwq la forma de hacer de añadir el listener ya lo tiene en su código. ¿Qué problemas tiene con esto? lo único sería modificar para no hacer en cada variable el document.getEleme... si no directamente la variable buttons[price - 1]; está claro que se está saliendo del objetivo de la pregunta.
    – Dev. Joel
    Commented el 21 ene. 2018 a las 19:53
  • @franciscodwq funcionó mi respuesta? ¿tiene duda sobre mi respuesta? sería bueno saberlo , no olvide leer ¿Qué debo hacer cuando alguien contesta mi pregunta?
    – Dev. Joel
    Commented el 23 ene. 2018 a las 3:31

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.