Hola buenas noches amigos de forosdelweb me dejaron un ejercicio muy simple tengo que hacer un cuestionario y con base a la respuesta seleccionada dar información , al momento de seleccionar la respuesta se debe ejecutar información acerca de ella, ya tengo todos mis archivos programados pero no se por que no funciona
Todos mis archivos están en la misma ubicación
Este es el archivo practicaAjax.html
Código PHP:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="estilo.css">
<script src="procesa.js" type="text/javascript" ></script>
<title>Ajax</title>
</head>
<body>
<p class="pregunta"> Selecciona la espuesta correcta</p>
<p class="pregunta"> ¿Quienes conformaban la tripe alianza?</p>
<pre class="respuesta">
a) Tenochtitlan, texcoco y tlacopan
b) Venezuela, Perú, Bolivia
c) No existe
</pre>
<select id="seleccion" onchange="iniciar()">
<option >Selecciona una respuesta</option>
<option value="a">Respuesta A</option>
<option value="b">Respuesta B</option>
<option value="c">Respuesta C</option>
</select>
<p id="contestacion"></p>
</body>
</html>
Este es el archivo procesa.js
Código PHP:
var xhr;
function iniciar()
{
xhr = new XMLHttpRequest();
enviarpeticion();
}
function enviarpeticion()
{
var seleccionar = document.getElementById("seleccion").value;
switch(seleccionar)
{
case "a":
xhr.open("GET", "respuestaa.txt", true);
xhr.onreadystatechange=procesardatos();
xhr.send(null);
break;
case "b":
xhr.open("GET", "respuestab.txt", true);
xhr.onreadystatechange=procesardatos();
xhr.send(null);
break;
case "c":
xhr.open("GET", "respuestac.txt", true);
xhr.onreadystatechange=procesardatos();
xhr.send(null);
break;
}
}
function procesardatos()
{
if(xhr.readyState==4 )
document.getElementById("contestacion").innerHTML = xhr.responseText;
}
y bueno cada archivo respuesta.txt esta en la misma carpeta con su respectiva información pero no se por que no se muestra en el navegador al seleccionar una respuesta espero me puedan ayudar , muchas gracias