Hola, estoy dando mis primeros pasos en Ajax, consigo cargar bien datos en mi pagina principal, pero me encuentro con un problema, los datos que muestro tienen links, que mostrarian otros datos, pero quiero que al darle al link se muestre en la misma capa, ahora al hacer link pues me va a la pagina a la que linco. Quiero conseguir un efecto parecido a este:
www.gamespot.com (el cuadro central que muestra informacion, ellos lo tienen en flash, pero yo quiero hacer algo parecido en AJAX)
Ahora tengo esto:
index.php:
Código HTML:
<script language="javascript" type="text/javascript" src="js/ajax.js"></script>
<body onLoad="return principal('ventana.php','ventana');">
<div id="ventana" style="position:absolute; left:93px; top:127px; width:341px; height:141px; z-index:2"></div> ventana.php:
Código PHP:
<?php
include "./includes/conexion.php";
conectar();
?>
<?php
if(!isset($ver)) $ver=noticias;
switch($ver)
{
case 'noticias':
$noticias=mysql_query("SELECT titulo FROM noticias WHERE '1'");
while($row = mysql_fetch_array($noticias))
{
$titulo=$row['titulo'];
print("$titulo<br>");
}
break;
}
?>
<div align="left"></div>
<div align="left"></div>
</div>
<div id="Layer3" style="position:absolute; left:334px; top:16px; width:107px; height:204px; z-index:2">
<p class="style1"><a href="ventana.php?ver=noticias">Noticias</a></p>
<p class="style1"><a href="ventana.php?ver=analisis">Analisis</a></p>
<p class="style1"><a href="ventana.php?ver=avances">Avances</a></p>
<p class="style1"><a href="ventana.php?ver=articulos">Articlulos</a></p>
</div>
</div>
Los links de arriba tendrian que hacer que se mostrara una cosa u otra...
ajax.js:
Código:
function principal(pagina,divID)
{
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}
if(XMLHttpRequestObject)
{
var mostrar = document.getElementById(divID);
XMLHttpRequestObject.open("GET", pagina, true);
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
{
mostrar.innerHTML = XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.send(null);
}
}