¿Uso de # como variable?

[buzu]

daPhyre, no te compliques reinventado la rueda, usa swfaddress.

( David)

[Triby]

Iniciado por David el Grande

Ahora, en cuanto al tema, yo le veo bastante utilidad a eso al usar AJAX , como ya venía diciendo buzu (); no veo por qué sería algo malo.

ahmm... los motores de busqueda podran ver el contenido de los marcadores?

Le pregunte a San Google y parece que estas practicas no le gustan, suponiendo que apple aparezca #section=justhd en alguna de las paginas de resultados, FDW sale en la primera pagina, nada rentable para el dueño del sitio.... a menos que no necesite de San Google para atraer visitantes.

[Mikmoro]

Iniciado por Triby

Le pregunte a San Google y parece que estas practicas no le gustan, suponiendo que apple aparezca #section=justhd en alguna de las paginas de resultados, FDW sale en la primera pagina, nada rentable para el dueño del sitio.... a menos que no necesite de San Google para atraer visitantes.

Casi cada día digo eso mismo en alguna ocasión: ¡ese es realmente un argumneto de peso para quienes hacen negocios en la red, y punto!
Gracias por aportarlo en este caso, Triby.

[daPhyre]

Por el uso que le dan a estas páginas, no creo que la intensión sea que Google direccione a estos lugares, si no que un usuario pueda entrar directamente a un área que se carga por AJAX, cosa que parece atractiva dado que no se puede pasar a veces un link directo a una página cargada con AJAX a otra persona.

¿Nunca les ha sucedido que entran a una página con AJAX, les gusta algo y se la envían a un amigo?
-Oye, checa esta página, pero dale click en esta área para que veas lo que te quiero decir.
-¿Donde están los botones?
-Son el menú de arriba.
-¿Los de color azul?
-No, los grises.
-No los veo.
-¡Allá! ¡¡¡En la esquina!!

(Caso real )

Bueno, tras unas horas de investigación, he llegado a este resultado:

Código HTML:

<a href="#pagina1.html" onclick="location.reload();">página 1</a> 

Y el código AJAX:

Código:

var cadena=location.href;
var pos=cadena.lastIndexOf('#')
document.write("<p>Espere mientras carga la página.</p>");
if (pos > 1){
 var url=cadena.substr(pos+1);
 loadurl(url+'.html', 'main');
}
else{
 loadurl('pagina1.html', 'main');
}

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);
	return false;
}

function createXMLHttpRequest() {
	var xmlHttp=null;
	if (window.ActiveXObject) 
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if (window.XMLHttpRequest) 
			xmlHttp = new XMLHttpRequest();
	return xmlHttp;
}

Me resultaba bien en mi compu, aunque al retroceder en el historial no recargaba las páginas.

Por otro lado, al subirlo al servidor, desincronizaba el link y la recarga, por lo que básicamente no servía.

El ejemplo lo subí aquí: http://mx.geocities.com/daphyreweb/w...html#sharpcode , ¿Ustedes que opinan? ¿Como podrían corregirse estos detalles?

[Mikmoro]

Es que yo creo que no está bien. A la tarde si puedo busco un ejemplo de uso real que tengo puesto de lo del acceso directo a páginas con contenido cargado con Ajax, que es básicamente con el script que puse hace ya unos cuantos mensajes, el split y el separador ?loquesea=.

Creo que recordar que con ese script me ayudo JavierB, pero no estoy seguro.

[Mikmoro]

Voy a ver qué tal puedo explicar eso que te decía, con un caso real de una página en la que colaboré hace ya un tiempo:

Tenemos una galerías de fotos que se cargan mediante Ajax. Si tú accedes a la página de las galerías, te sale la definida por defecto:
http://www.artsaia.com/salaconcierto...a/galeria.html
y luego están todos los enlaces para cargar cualquiera de ellas mediante ajax en el carrete de arriba.

Script AJAX:

var peticion = false;
if (window.XMLHttpRequest) {
peticion = new XMLHttpRequest();
} else if (window.ActiveXObject) {
peticion = new ActiveXObject("Microsoft.XMLHTTP");
}


function ObtenerDatos(datos,divID) {
if(peticion) {
var obj = document.getElementById(divID);
peticion.open("GET", datos);
peticion.onreadystatechange = function() {
if (peticion.readyState == 4) {
obj.innerHTML = peticion.responseText;
}
}
peticion.send(null);
}
}

Cada galería se carga con un enlace como este:
<a href="javascript:ObtenerDatos('sala7_3.html','carr ete');">, en el que llamamos a la función de ajax y le decimos qué archivo cargar (sala7_3.html) y en qué div (carrete). Supongo que hasta aquí todo sencillo y claro.

¿Cómo hacemos ahora para poder enlazar una galería de manera que se pueda acceder a ella directamente, es decir, que se cargue la página inicial de las galería pero con la que me interesa ya cargada?

En primer lugar usamos el script que puse más arriba (y en el que no recuerdo bien quién me ayudó, vamos, que creo que no era mio):

function seleccionar(){
ele=(location.search).split('?acceso=');
if(ele!=''){
ObtenerDatos(ele[1],'carrete');
}
else {
ObtenerDatos('paul_gilbert.html','carrete');
}
}

con lo que le decimos que si viene una petición que traiga la cadena de corte (?acceso=), coja la segunda mitad [1] y la añada a la función "ObtenerDatos", de manera que se cargará la página inicial y añadiendo:
<body onload="seleccionar();">
se ejecutará al cargar la función javascript que cargará el parámetro pasado por la url en el div correcto, y si viene vacía (sin parámetro), que cargue la que está prevista, la inicial.

Ahora ponemos en el enlace la dirección con el parámetro del split y el HTML que queremos que se cargue mediante ajax, y ya tenemos un enlace a la galería con la galería concreta cargada:

<a href="http://artsaia.com/salaconciertos/galeria/galeria.html?acceso=sala7_3.html">
http://artsaia.com/salaconciertos/ga...o=sala7_3.html</a>

No sé si estará suficientemente claro. Esto responde a tu duda sobre cómo acceder directo (espero).

Y para enlazarlo con todo el tema anterior, imagino que ese "galeria.html" lo cambiamos por un index.hml en esa carpeta, y el parámetro del corte ?acceso= por una almohadilla, y ya tenemos el caso del que hablabas al principio, que podría ser un ancla o no, según sea este caso que expongo o el que puse al principio.

[buzu]

daPhyre, tu ejemplo se recarga, no se logra el efecto, creo que estas tomando el camino equivocado...

[David]

Hola, Mikmoro.

Buen ejemplo el que pusiste.
Aunque parece poco usable en algunos casos. Explico:

- ¿Y si yo soy un usuario mortal que quiero que un amigo venga a esa página y vea el álbum que yo estoy viendo? ¿Qué sería lo primero que yo haría? Copiaría la URL de la barra de direcciones. Resultado: me dirigiría al primer álbum y no al que yo quiero mostrar a mi amigo.

- Lo mismo ocurre si estoy en esa página viendo ese álbum y quiero agregarlo a Marcadores.

- En otro momento hablemos de los botones atrás y regresar al usar AJAX .

[daPhyre]

Mikel: Comprendo tu ejemplo, es de hecho, lo que tenía antes, con un poco de lo que tengo ahora (Excepto por los sharps, que es el caso que investigo ahora)

Buzu: Es lo que explicaba, en mi compu carga bien, pero en la red, toma primero la recarga, luego el nuevo link, y borra el link poniendo la parte de la recarga, con lo que se pierde el efecto.

David: Esos eran los puntos que estaba observando. Gracias.

[Mikmoro]

Pero estamos hablando de cosas diferentes: si habéis leido la parte final, veréis que por un lado, eso no está hecho para un "hotlink", sino para que tú puedas enlazar de donde quieras a esas páginas internamente, ofrecer enlaces en tus propias páginas o a lugares ajenos a los que tú mismo pones los enlaces, y por otro digo que esto no sé si sería muy difícil de modificar para lo que se comentaa anteriormente.

Si sigues mi enlace, David, verás que en la barra de direcciones tienes un hotlink para mandar a tu amigo. Lo que se persigue es llegar desde fuera a la página inicial con la que quieras ya cargada con AJAX, no que al cargar otras galerías en la propia página su url sea un hotlink ¿No era eso lo que se pedía? entonces no he entendido la pregunta de daPhyre

Ahora ya no tengo nada claro qué es lo que preguntaba inicialmente daPhyre, si mis respuestas tuvieron algún sentido, qué se persigue ahora, etcétera. Creo que me he desubicado.

[HackmanC]

Hola,

Como dije anteriormente, no creo que sea un funcionamiento adecuado, puesto que presenta muchos inconvenientes entre los navegadores. Aunque Mikmoro presentó el concepto claramente y funcional, (aunque el ejemplo del vínculo evidentemente no funcionó como se esperaba, creo que es por que lo tiene dentro de un iframe).

Lograr ese funcionamiento no es complicado, demostrarlo es sencillo, aunque no va a funcionar en todos los navegadores, por que no es un funcionamiento adecuado (va en contra de las especificaciones de los URL, el protocolo HTTP y como funcionan los browsers actualmente).

Por ejemplo, en una página con estos vínculos:

Código:

<p><?php echo 'SERVER ID : ' . rand(); ?></p>
<p><a id="link1" href="#pagina1" name="link1">Pagina 1</a></p>
<p><a id="link2" href="#pagina2" name="link2">Pagina 2</a></p>
<p><a id="link3" href="#pagina3" name="link3">Pagina 3</a></p>
<p><a id="link4" href="#pagina4" name="link4">Pagina 4</a></p>
<p id="view">&nbsp;</p>

Observen que hay una llamada a una función de PHP, para averiguar cuando llega al servidor y cuando no llega, puesto que si llega al servidor esa parte de la página cada vez que cargamos algo con AJAX, no tendría sentido usar AJAX (como en el caso de usar location.reload()). (Si no tienen acceso a un servidor con PHP, van a tener que eliminarlo y no van a poder comprobar esa parte)

Seguidamente el Javascript:

Código:

function navigate(where) {
 // Documento cargado con AJAX.
 document.getElementById("view").innerHTML = where;
}

window.onload = function () {
 var i;
 for (i = 0; i < document.links.length; i++) {
  document.links[i].onclick = function () {
   navigate(this.href);
   return true;
  };
  if ((new RegExp(document.links[i].href + "$")).test(window.location)) {
   navigate(document.links[i].href);
  }
 }
}

En este caso, primero, a todos los vínculos se le asigna el evento para navegar con AJAX, aunque en este caso no escribí todo el procedimiento de AJAX, solamente es para fines demostrativos.

Seguidamente use una expresión regular para averiguar si el fragmento introducido en el URL está al final de la ubicación actual del browser, y navega, con la supuesta función navigate() para cargar la información.

Si lo prueban en cualquier browser 'actualizado', van a poder ver que cada vínculo cambía el URL del navegador y cambia el contenido del parrafo 'view', y cuando escriben el URL directamente en 'UNA PAGINA NUEVA' del browser, van a poder observar que efectivamente, cambia el contenido.

Ahora vienen mil problemas ... el browser piensa que cuando se cambia el 'fragmento' a mano, por ejemplo de '#pagina3' a '#pagina2', no necesita ni enviarlo al servidor, ni ejecutar de nuevo el Javascript, por que NO era necesario actualmente.

Tampoco va a funcionar el botón atrás, puesto que esa página no existe en el Historial del browser, el browser ni se enteró que la página cambió de estado por medio de Javascript. (En las especificaciones del URL está claro que son 2 URL distintas y debería de guardarlo en el Historial, pero nunca se ha hecho así).

Es una casualidad que Chrome y Safari no solo guarda en el historial la página, sino que la manda al servidor. ¿Será por eso que a mí me funciona Gmail en Chrome, y da tantos problemas en Firefox?

Estoy ya había sucedido con los iframes cuando comenzaron a ser populares, y me pasaba algo parecido con el historial, pero cada quien saque sus propias conclusiones. <edit> Y comente que piensa ... </edit>

Saludos,

[Mikmoro]

Iniciado por HackmanC

aunque el ejemplo del vínculo evidentemente no funcionó como se esperaba, creo que es por que lo tiene dentro de un iframe).

¿No ha funcionado como se esperaba?
No sé exactamente a qué te refieres. Quizá te refieres a lo que resaltan David y DaPhyre, pero para lo que yo pretendía se equivocan. Ya lo expliqué en el siguiente mensaje. Igual hablas de otra cosa.
Y bueno, tampoco es que tenga mucha importancia pero por seguir el debate.

[tunait]

Iniciado por daPhyre

Últimamente he visto que hay algunas páginas como esta:

miweb.com/mensajes/#seccion2

El punto es que este no envía a una sección de la página, si no a la página siguiente, como si fuera una variable de PHP.

¿Como se hace esto? ¿Como se recupera este valor para usarlo de esta forma? ¿Es JS? ¿PHP?

Gracias por las respuestas

'nas

a mí lo que se me ocurre es que estén usando el mod-rewrite y traduzcan las peticiones a algo tipo miweb.com/mensajes.php?pagina=2

Código:

Rewriterule ^mensajes/#seccion[0-9]+$ mensajes.php?pagina=$1 [NC,L]

y el navegador ignora el # al no encontrar un identificador con ese nombre al que saltar.

Pero no me hagan mucho caso que cada vez que digo algo meto la gamba hasta el fondo

[HackmanC]

Hola,

Iniciado por Mikmoro

... ¿No ha funcionado como se esperaba?
No sé exactamente a qué te refieres. ...

Solamente que el URL de la dirección del browser no cambia, aunque explicaste claramente que eso no es importante porque pusiste el vínculo para copiar y pegar en otro lugar. Me refería a que esperaban que cambiara en la barra de direcciones del navegador (creo); de otra forma entonces funciona como se esperaba.

Igual disculpas si hubo un malentendido!

Saludos,

[HackmanC]

Hola,

Iniciado por tunait

... a mí lo que se me ocurre es que estén usando el mod-rewrite y traduzcan las peticiones ...

La idea es que no llegue al servidor. (Creo?, ahora ya estoy confundido )
Sino entonces si es mucho mas fácil usar mod-rewrite.

Saludos,

[tunait]

Bueno, yo es que me quedé en la pregunta inicial
Luego se ha planteado el tema de lo de no recargar la página y eso y ahí no me meto que sólo llevo un café encima

[Mikmoro]

Iniciado por HackmanC

Igual disculpas si hubo un malentendido!

Bueno, no malentendido en sí, es que no te había entendido en ese caso. Sigue el segundo enlace de mi ejemplo y debería salirte en la barra de direcciones la url lista para copiar y pegar como un hotlink. Si no es así, algo falla porque a mi si me sale así.
Como he dicho, creo que ya casi he perdido el norte en este hilo.

[Mikmoro]

Iniciado por tunait

Bueno, yo es que me quedé en la pregunta inicial

A mi, tunait, a la pregunta inicial me sigue pareciendo mucho más razonable mi primera explicación que el rewrite:

http://www.forosdelweb.com/f91/uso-c...5/#post2739972

[tunait]

Ahora con algunos cafés más en el organismo propio y revisando el tema un poco más a fondo me doy cuenta de que, en el caso concreto de que lo único que cambia en la url es el identificador del fragment lo del mod-rewrite no es aplicable dado que, como mencionó HackmanC unos cuantos mensajes más arriba, si no hay otro cambio en la url el navegador no envía la petición al servidor y por lo tanto no hay mod-rewrite que pueda meter la cuchara.

Ves que no había que hacerme mucho caso ... debo recordar no responder nunca antes del tercer café

[daPhyre]

Finalmente lo logré. Decidí cambiar la forma en que los accedía, eliminando la recarga de la página, haciéndolo más al estilo de la forma tradicional, pudiendo así de paso usarlos en forma accesible para quienes tienen desactivado JavaScript:

Código:

var cadena=location.href;
var pos=cadena.lastIndexOf('#')
document.write("<p>Espere mientras carga la página.</p>");
if (pos > 1){
 var url=cadena.substr(pos+1);
 loadurl(url+'.html', 'main');
}
else{
 loadurl('pagina1.html', 'main');
}

function loadurl(url, id){
	var cadena=location.href;
	var pos=cadena.indexOf('#')
	var posurl=url.indexOf('.')
	location.href=cadena.substr(0,pos)+'#'+url.substr(0,posurl);
	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);
	return false;
}

function createXMLHttpRequest() {
	var xmlHttp=null;
	if (window.ActiveXObject) 
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	else if (window.XMLHttpRequest) 
			xmlHttp = new XMLHttpRequest();
	return xmlHttp;
}

Y los links exactamente iguales que como siempre:

Código HTML:

<a href="pagina1.html" onclick="return loadurl('pagina1.html','main')">página 1</a> 

Como dije antes, la única diferencia que veo entre esta técnica y el Ajax común es que con este, se puede acceder a cierta página que se carga con Ajax directamente de la barra de direcciones. No un cambio muy abismal en vista ni en código, pero un excelente detalle para hacer un Ajax más accesible ¿Ustedes que opinan?

[Triby]

Excelente, ahora solo quedaria hacer dos versiones de cada pagina que mandes llamar con este metodo, una por si javascript esta habilitado y se carga en una "capa" de la pagina actual y otra, cuando javascript no esta habilitado y necesitas cargar todas las otras capas como menu, header, etc.

Comienza a gustarme la idea de usar esta tecnologia en algun proyecto muy especifico, solo para probar... o quien sabe...

[buzu]

Excelente, ahora solo quedaria hacer dos versiones de cada pagina que mandes llamar con este metodo, una por si javascript esta habilitado y se carga en una "capa" de la pagina actual y otra, cuando javascript no esta habilitado y necesitas cargar todas las otras capas como menu, header, etc.

Si tienes que crear dos versiones no le veo la ventaja. No necesitas crear dos versiones, el usuario que no tiene js o por alguna razon falla el script aun ve el contenido, que es lo importante, pero no en la misma forma.