El problema con tu ejemplo es que intentas acceder a la instancia de la función constructora
Alert mediante JavaScript
inline, es decir, incrustado en HTML. No es reconocida porque no fue creada en el mismo alcance. E incluso si hicieras la declaración de dicha variable con la instancia, tendrías que añadir a la función misma por cada botón; es por esta y otras razones que hace mucho tiempo que no se recomiendas trabajar con JS incrustado en HTML.
Para poder acceder a la misma, necesitas hacerlo en el mismo espacio del código JS. Como todos los botones de respuesta ejecutan la misma función, enviándole cada una un valor distinto, puedes delegar el evento
click a la sección en la que se encuentra todo, para lo cual sería recomendable asignarle un identificador, y las respuestas serían los valores de cada botón.
Código Javascript
:
Ver originalvar section = document.querySelector("#quiz");
section.addEventListener("click", function(event){
if (event.target.type == "radio"){
Alert.render(event.target.value);
}
}, false);
Mediante la propiedad
target del
objeto del evento, se puede acceder al elemento directamente afectado por el evento. Una vez comprobado que se trata de un
radio button, pasas a invocar al método
Alert.render() pasándole como argumento el valor de la respuesta. El evento también puede ser delegado a otro elemento ancestro, por ejemplo, al documento.
Y para la obtención de la sumatoria de las respuestas correctas e incorrectas, necesitas dos variables para acumular ambas cantidades y, cuando verifiques que la respuesta selecciona es correcta o incorrecta, sumas un 1 a la respectiva variable acumuladora.
