Primero: Crea los html a ser cargados removiendo la información extra al principio (las etiquetas <html>, <head> y su contenido, y <body>)
Segundo: En la página principal donde ponias los frames, sustituye este lugar por un div con un id, por ejemplo:
Código HTML:
<div id="main">
<noscript>JavaScript está desactivado, AJAX no podrá ser usado</noscript>
<script src="ajax.js" type="text/javascript"></script>
</div>
Donde ajax.js será tu código de JavaScript.
Tercero: El código JavaScript ("ajax.js"):
Código:
document.write("<p>Espere mientras carga la página.</p>");
function loadurl(url,id){
var pagecnx = createXMLHttpRequest();
pagecnx.onreadystatechange=function(){
if (pagecnx.readyState == 4 && (pagecnx.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(id).innerHTML=pagecnx.responseText;
}
pagecnx.open('GET',url,true)
pagecnx.send(null)
}
function loadurlkey(e,url,id){
tecla = (document.all) ? e.keyCode : e.which;
if (tecla==13)
loadurl(url,id);
}
function createXMLHttpRequest(){
var xmlHttp=null;
if (window.ActiveXObject)
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
else if (window.XMLHttpRequest)
xmlHttp = new XMLHttpRequest();
return xmlHttp;
}
Para poderlo usar, cambia tus href a este modo:
Código HTML:
<a href="javascript:loadurl('pagina1.html','main')">página 1</a> Mandandole de parámetros el nombre de tu página, y el id del DIV donde lo vas a cargar. Además es posible que quieras que se cargue una de tus páginas en tu página principal cuando esta se abra. Para esto usa este código al abrir tu Body:
Código HTML:
<body onload="loadurl('pagina1.html','main')"> Espero esto sea lo que estabas buscando y te sirva.
Edito: Tuve un error en la línea para cargar la URL, como verán en el resto de los posts. Lo he corregido por si alguien en futura referencia llega a ver este código y desea usarlo. Si quieren ver el código en acción, les dejo este link donde lo pongo a prueba:
http://mx.geocities.com/daphyreweb/web/tips/ajax/ Edición 2: He descubierto una forma de hacer uso de los links de forma más accesible. Para ello, utilizamos los href de esta forma:
Código HTML:
<a href="pagina1.html'" onclick="loadurl('info1.html','main'); return false" onkeypress="loadurlkey(e,info1.html','main')">página 1</a> Donde info1.html será la página a cargar, y pagina1.html será la página que se cargará en caso que JavaScript esté desactivado. ¡Suerte a todos!
Edición 3: Hemos llegado a encontrar una solución más accesible. Para saber más de esta, sigue este link:
http://www.forosdelweb.com/f85/ajax-...4/#post2481660
¡Suerte!