Para lograr lo que buscas verificar si uno de los 2 radio
esta seleccionado, considero que es mas simple proceder de este modo:
let radios = document.querySelectorAll(".radios")
radios.forEach((elemento) => {
elemento.addEventListener("change", () => {
let actividad = (elemento) ? `Cambio, elegiste: ${elemento.value}` : `No cambio`
console.log(actividad)
})
})
Donde:
- Obtenemos a todos por medio de una clase asignada que en este caso llamaremos
radios
- Como
querySelectorAll
nos devuelve una lista de nodos de todos los elementos coincidentes entonces los recorremos con unforEach
- Ahora por cada
elemento
que obtiene el bucle en sus iteraciones verificamos elevent
dechange
que ocurre cuando seleccionas unradio
- Si dicho elemento que representa a uno de los
radios
esta enchecked
entonces su valor estrue
por eso solo lo escribí como:(elemento)
entonces imprimimos elvalue
que posee para no solo saber que fue elegido sino además recuperar que valor tiene asignado dichoradio button
EJEMPLO COMPLETO
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Ejemplo 1</title>
</head>
<body>
<input type="radio" class="radios" className="radiosbtn" name="sipa" id="sipa" value='false'/>Si
<input type="radio" class="radios" className="radiosbtn" name="sipa" id="sipa" value='true'/>No
<div id="aviso"></div>
<script>
let radios = document.querySelectorAll(".radios")
radios.forEach((elemento) => {
elemento.addEventListener("change", () => {
let actividad = (elemento) ? `Cambio, elegiste: ${elemento.value}` : `No cambio`
document.getElementById("aviso").innerHTML = `Elegiste: ${elemento.value}`
})
})
</script>
</body>
</html>