Pregunta

Tengo dos páginas html, cuando haces clic en algo en el primer html, irá al segundo. Lo que quiero hacer es mostrar el texto de acuerdo con lo que hizo clic en el primer html. diferentes textos están envueltos con diferentes identificadores. Así es como escribí:

<a href="secondpage.html#one"></a>
<a href="secondpage.html#two"></a>
<a href="secondpage.html#three"></a>

Espero ver two.html cargar el texto con id '' one '', pero no funciona, ¿alguien sabe lo que hice mal?

Aquí está el código en la segunda página:

<ul id="menu" class="aaa">
    <li><a id="one" href="#">one</a></li>
    <li><a id="two" href="#">two</a></li>
    <li><a id="three" href="#">three</a></li>
</ul>

Y tengo un archivo JS para modificar cada id:

$("one").observe('click', function() {
    $('Pic').writeAttribute('src',"picone.jpg");
    $('Bio').update("texthere!");
});

Lo mismo para dos y tres.

En este momento, si hago clic en un botón en la primera página, siempre se mostrará el texto y la imagen de "uno", sin importar en qué botón haga clic.

Pero quiero ver la imagen y el texto de " dos " si hago clic en él.

¿Fue útil?

Solución

Lo que quiere hacer es simular un clic en su ancla cuando se carga la página. Dado que está utilizando jQuery, el enfoque más simple (pero mucho mejor) sería el siguiente:

$(window).observe('domready', function () {
    $(location.hash).click();
});

adjunte ondomready-event a la ventana. Obtenga el elemento con id = uno (con jQuery, esto sería '#one', igual que su ubicación.hash sería, muy útil en este caso), active un clic en él.

Es posible que deba reemplazar $ (location.hash) .click (); con $ (location.hash) .get (0) .click () ya que jQuery tiende a devolver matrices de objetos jQuery.

Pero una mejor solución en su caso sería tener un controlador de eventos que pueda activar de forma manual, evitando así la necesidad de disparar eventos, además de soltar los anclajes y hacer clic directamente en sus li.

Y además, ¿por qué carga una segunda página cuando todo lo que parece querer hacer es mostrar / ocultar contenido dinámicamente? Hazlo en la misma página ...

Otros consejos

la #blastuffbla no es una identificación sino el hash de ubicación. Puede acceder a ella usando:

self.document.location.hash

que devolvería #hash, si solo quisieras hash usarías:

self.document.location.hash.substring(1)

Espero que esto ayude

Las etiquetas

no tienen identificadores, sino nombres para manejar los anclajes en Urls, aunque aún necesitará el ID para administrarlos en JS. Entonces su lista debería ser:

<ul id="menu" class="aaa">
<li><a id="one" name="one" href="#">one</a></li>
<li><a id="two" name="two" href="#">two</a></li>
<li><a id="three" name="three" href="#">three</a></li></ul>

Sin embargo, su javascript parecía correcto.

Cuando dices " diferentes identificadores " ¿Cómo está configurando sus anclas en la segunda página? El ancla en la segunda página debería verse así:

<a name='one'></a>

Coloque esto justo encima del texto que desea marcar en la segunda página.

¿Desea desplazar la página a la posición del id " one " ;? Tal vez el contenido de la página es demasiado pequeño para que no pueda desplazarse allí. Quiero decir que a veces el navegador no puede mover el elemento marcado con la identificación a la parte superior del lienzo y parece que no se desplaza allí. Intente incluir suficiente espacio después del elemento para que se pueda desplazar a la parte superior del navegador.

Espero que eso ayude.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top