Ir al final de página sin utilizar "anclaje"

lemmy2011 · #1 (**permalink**) 21/08/2011, 11:52

Hola a todos. A ver si consigo explicarme. He montado un blog mediante PHP. Después del artículo, se permiten agregar opiniones. La estructura afectada por mi consulta sería:

<div1>
Contiene el artículo
Posibilidad de incluir comentarios
</div>

<div2><? include('./comentarios.php'); ?></div>

<a href="fin_comen"></a>

Por partes:
<div1> Bueno esto muestra el articulo y un textarea donde añadir comentarios.
<div2> Muestra los comentarios. Lo hago mediante un "include". Así, la aginacion es independiente de la web principal. Es decir, el hecho de paginar, sólo refresca el contenido de <div2> o lo que es lo mismo, los comentarios.

<a href="fin_comen"></a> Lo utilizo como anclaje. Os cuento, al incluir un nuevo comentario, éste se graba e invoco nuevamente la páginal principal. Los comentariso se muestran por orden de llegada. Por lo tanto, el nuevo comentario se vería el último.

¿Cuál es el problema? Al cargar la página, detecto si se acaba de incluir un nuevo comentario. Si es así, hago: window.location.href = "#fin_comen"; De esta manera debería ir al final de la página ( mostrando así el último comentario ). Pero esto hay navegadores que no me lo están aceptando. Y he visto el motivo. Como el ancla está después de "include", al hacer el window.location.href = "#fin_comen"; por lo visto, todavía no ha terminado de cargarse totalmente el contenido del <div2> y parece que no sabe ubicarse en el anclaje. Lo he probado sin el include y va perfectamente. Pero al incluirlo no me va al final. Se queda justo cuando empieza el <div2> Ah! el window.location.href = "#fin_comen"; lo he colocado también en el onload a nivel de <body> y nada.

Alguien sabría cómo poder solucionar este problema? O, siendo brutos, sabéis si hay alguna manera de forzar que se muestre el contenido del final de la página sin emplear anclajes?

Gracias por vuestro tiempo.

maycolalvarez · #2 (**permalink**) 21/08/2011, 12:22

los bookmarks se definen con name:

<a name="fin_comen"></a>

y php al ser un lenguaje del lado del servidor nada tiene que ver con HTML para esto

lemmy2011 · #3 (**permalink**) 21/08/2011, 12:33

Sí, sí... disculpa, al escribir el problema lo escribí mal. Realmente, el ancla, lo tengo definido como tu dices. Es decir:

<a name="fin_comen"></a>

Perdón por el lapsus...

emprear · #4 (**permalink**) 21/08/2011, 12:35

lemmy2011:
El comentario de @maycolalvarez fué más que preciso, y añadiría para tu información, que además del atributo name, podés utilizar un id como marcador interno

Saludos

lemmy2011 · #5 (**permalink**) 21/08/2011, 15:38

No, no es eso. Como os comentaba, al describir mi problema, cometí un error y escribí <a href="fin_comen"></a> en lugar de <a name="fin_comen"></a> La cuestión es la siguiente. Imaginad:

<div1>
Contenido del DIV
<a href="javascript:window.location.href='#fin_comen' >Final Página</a>
</div>

<div2><? include('./comentarios.php'); ?></div>

<a name="fin_comen"></a>

Una vez cargada la página, si clico sobre el enlace "Final Página" la web se desplaza hasta el ancla <a name="fin_comen"></a> FUnciona perfectamente

Pero, y aquí es donde tengo el problema, si trato de hacer lo mismo pero directamente al cargar la página, falla. Es decir, la siguiente estructura:

<div1>contenido DIV1</div>

<div2><? include('./comentarios.php'); ?></div>

<a name="fin_comen"></a>

[ si se produce cierta condicion ]:
<script>
window.location.href='#fin_comen'
</script>

En teoría, lo que debería hacer es desplazarse al ancla fin_comen pero no lo hace. Y eso es por que el ancla está después de un "include". Cuando la página ya está cargada no hay problema. Pero si no es así, si trato de acceder al ancla en tiempo de ejecución, entra en concflicto. Por un lado trata de ir a una posición ( la marcada por el ancla ) pero por otro no puede por que el contenido de "comentarios.php" aun no se ha resuelto. O dicho de otro modo ¿Como puedo ir a una posición determinada de la web, definida por un ancla y en tiempo de ejecición, si hay un include por el medio? ( si quito el include, valido que realmente accede a la posición definida por el ancla )

Nuevamente, gracias.

emprear · #6 (**permalink**) 21/08/2011, 16:28

lemmy2011:

los marcadores u anclas (ya sea con el name ó id), insertan referencias internas al documento. que pueden ser accedidas mediante
<a href="#referencia">Ir a referencia</a>, suponiendo que tu página sea index.php y quieres acceder a un marcador en esa página desde otra externa, entonces si utilizás <a href="index.php#referencia">Ir a referencia</a>, con lo cual estarás cargando nuevamente index.php
En tu aplicación, nada tiene que ver el include.
Si querés ir al fin de página desde la misa página , no usas
<a href="javascript:window.location.href='#fin_comen' >Final Página</a>
usas
<a href="#fin">Ir al final</a>

En tu script final, si tiene sentido el
window.location.href...
para que el enlace a dicho marcador sea automático
porque necesitas recargar la página en esa ubicación específica

Ejemplo

Código HTML:

Ver original<!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>
<title>titulo</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<body>
<h1 id="inicio">inicio</h1>
<p><a href="#fin">Ir al final</a></p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<?php
include('http://emprear.com.ar/notas.html');
?>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<p>x</p>
<h2 id="fin">fin</h2>
<p><a href="#inicio">Ir al inicio</a></p>
<p>x</p>
<p>si se cumple algo...</p>
<script type="text/javascript">
 window.location.href='#fin';
 </script>
</body>
</html>

Ese ejemplo, hace las dos cosas, carga el include, carga la página en Fin, y de ahi podes ir a inicio con un link y viceversa
Lo de la condición no me queda muy claro, epro en principio el problema lo tenes por lo que te expuse
Saludos

lemmy2011 · #7 (**permalink**) 21/08/2011, 17:31

Hola emprear. Muchas gracias por tu explicación. Lo hago tal cual me pones en tu ejemplo. Lo curioso es que, a veces funciona y va al final de la páginal, y a veces no. Llevo un día entero con algo tan primario como ir al final de la página al cargarla... Como comentaba, con un link del estilo:

<a href="#fin">Ir al final</a> Sí que funciona. Pero, si quiero hacerlo de modo automático, mediante el código que propones ( y que parece totalmente válido ):

<script type="text/javascript">
window.location.href='#fin';
</script>

A veces funciona, y otra veces no va al final de la página, sino que se queda a al altura del "include". Seguiré probando. Pero vamos, que me huelo que es lo que comentaba. Como está el include, se hace un pequeño "lío" y no sabe exactamente dón deubicarse. Puesto que por un lado debería ir a la posición <h2 id="fin">fin</h2> per por otro, como todavía no ha terminado de cargar el contenido de include('http://emprear.com.ar/notas.html'); pues parece que se pierde...

lemmy2011 · #8 (**permalink**) 21/08/2011, 18:26

Vale! Creo que ya lo tengo... Os cuento por si os puede servir de utilidad:

la página referenciada mediante el include ( para el ejemplo de <? include('./comentarios.php'); ?> me refiero la página comentarios.php ) pues "comentarios.php" contiene un fragmento AJAX. Este AJAX recarga "comentarios.php" nada más entrar. Y recarga paginando a la última página. Bueno, el tema está que existe ese AJAX. Y se ejecuta. Un AJAX que se ejecutaba de modo ASINCRONO. Algo del estilo:

$.ajax({
type: "GET",
url: "./comentarios.php?&p_pag="+p_nropagina,
async: true,
success: function(datos){ divContenido.innerHTML = datos; }
});

Esto lo que hacía era cargar nuevamente "comentarios.php" en "divContenido" ( divContenido no es más que el div principal que contenía la sección de comentarios ). Pero claro, como estaba definido como ASINCRONO, el servidor no esperaba a que terminase la ejecución o la petición propia de AJAX. Y, por lo tanto, entraba en conflicto: Por un lado enviaba a la web al final, pero por otro el AJAX todavía no había finalizado su ejecucón. En cambio, he cambiado el modo a AJAx, ahora lo ejecuto de modo SÍNCRONO ( la definición sería la misma pero con async: false ). Qué pasa ahora? Que el script ( página principal ) espera a que el código AJAX termine. Entonces, como ya ha terminado la ejecución del AJAX, no hay conflicto con el ancla. Pues todo el código dependiente del "include" ha sido ejecutado... Vaya, o eso creo ;P

Muchas gracias a todos!

emprear · #9 (**permalink**) 21/08/2011, 18:30

bueno, me alegro que lo hayas solucionado
Saludos