Hola estoy armando mi primera web con ajax, es de esperar que me surgieron mis primera complicasiones.
Luego de leer mucha info sobre AJAX (Q es ajax,Para que sirve,Donde aplico Ajax, Bla bla). Me surge un problema al aplicarlo.
Tengo 2 html. Un html principal que esta estructurado con div, y quiero que al apretar un link me cargue otro html dentro de un div("cuerpo").
Aqui el codigo.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Lujan</title>
<style type="text/css" media="screen">
@import"./css/estilo.css";
</style>
<script language="javascript" type="text/javascript" src="javascript/java.js">
</script>
</head>
<body>
<!--DIV PARA CENTRAR TODA LA WEB-->
<div id="web">
<!--CABESERA DE LA WEB-->
<div id="cabesera">
<div id="login">
<form>
<input name="usuario" id="usuario" value="Usuario" class="input"/>
<input name="password" id="password" type="password" value="P assword" class="input"/>
<input type="submit" value="Entrar" class="loginBot"/>
</form>
</div>
<div id="logo">
</div>
<!--BOTONERA DE LA WEB-->
<div id="menuPrin">
<ul id="botonPrin">
<l1><a href="#" id="boton-2" onclick="MuestraArchivo('seccion11.html','cuerpo') ;">NOSOTOS</a></l1>
<l1><a href="#" id="boton-2">MURO</a></l1>
<l1><a href="#" id="boton-2">EVENTOS</a></l1>
<l1><a href="#" id="boton-2">CIRCULOS</a></l1>
<l1><a href="#" id="boton-2">CONTACTO</a></l1>
<l1><a href="#" id="boton-2">PUBLICIDAD</a></l1>
<l1><a href="#" id="boton-2">USO</a></l1>
<l1><a href="#" id="boton-2">REGISTRARSE</a></l1>
</ul>
</div>
</div>
<!--CUERPO DE LA WEB-->
<div id="cuerpo">
</div>
<!--PIE DE LA WEB-->
<div id="pie">
<p>CLUBBERSBOOK | COPYRIGTH © 2010 | <a href="#" id="link-1">LICENCIA</a></p>
</div>
<!--DIV PARA CENTRAR TODA LA WEB-->
</div>
</body>
</html>
Aqui el codigo JS
var xmlhttp = false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try {
xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");
}
catch (e){
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest != 'undefined'){
xmlhttp = new XMLHttpRequest();
}
function MuestraArchivo (serverPage, objID){
var serverPage = "seccion1.html";
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
Ya intente hacerlo pero no me anda. Me pueden ayudar?
Gracias desde ya.