Agregar un hash a la url sin desplazarse por la página? con javascript

  1. abro la página
  2. me desplazo hacia abajo
  3. Hago clic en el enlace que agrega un hash (quizás con un valor #test) (ejemplo: http: //www.example. com / # prueba)
  4. la página NO DEBE desplazarse hacia arriba.

¿Cómo se puede hacer esto?

Nota: solo verificando si es posible deshabilitar el movimiento, incluso si hay alguna etiqueta con id = "test" hasta el momento, return false; funciona bien (para admitir personas sin javascript) y también para evitar la presencia de identificadores en el html, pero no es un problema con cosas como números, como 1, 2, 3 (de todos modos, no están permitidos como identificadores)

Todas las respuestas son geniales, nada nuevo o innovador, y no hay soluciones sobre cómo romper la funcionalidad predeterminada, pero lo hará. :) Gracias por tomarte el tiempo para responder.

9
Timo Huovinen 17 sep. 2009 a las 20:25

4 respuestas

La mejor respuesta

Cualquier hash que no esté presente en la página debería darle este comportamiento. Por ejemplo, este enlace apunta a un no- hash existente en esta página. (Link probado con Chrome 2.0 e IE 6 (los únicos navegadores que tengo disponibles en este momento)).

Entonces, si su URL está causando que vaya a la parte superior de la página, asegúrese de no tener nada en la página cuyo identificador o nombre sea esa dirección.

17
Community 23 may. 2017 a las 10:29

La respuesta de Welbog funciona bien, pero deja el hash #nonexistantanchor en la barra de direcciones del navegador.

Para hacer esto con jQuery, puede agregar una clase al ancla y utilizar el método evitar el método predeterminado para deshabilitar tanto la navegación como el cambio a la url.

<a href='#' class="nodefault">Clickable</a>

<script>
$("a.nodefault").click(function(event) {
  event.preventDefault();
});
</script>

Por supuesto, el dilema estético ha terminado si se prefiere una url elegante o una solución libre de JavaScript.

0
nimasmi 28 ago. 2012 a las 15:28

Cada navegador interpretará el valor hash como "ir a esa ID de DOM". Podrías probar dos cosas en las que puedo pensar:

  1. Realice la acción que agrega el hash para devolver falso, deshabilitando así la necesidad del navegador de buscarlo

  2. Agregue una etiqueta DOM con la ID del hash que está agregando justo donde está el clic, para detener el movimiento del navegador. Pero probablemente esto no sea lo que quieres, ya que estás agregando el hash para algo.

0
Alessandra Pereyra 17 sep. 2009 a las 16:29

Cualquiera de los ejemplos a continuación debe hacer lo que desea:

<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<a href="pleaseEnableJS.html"
    onclick="window.location.hash = '#test1';return false;">Test 1</a>
<a href="#test2">Test 2</a>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>

Si hay algún elemento con id="test1" o id="test2" o <a name="test1"></a> o <a name="test2"></a> en su página, se desplazará a ese elemento, de lo contrario debería funcionar como usted lo solicitó.

Si tiene un código que no funciona como se esperaba, edite su pregunta e incluya un pequeño ejemplo de HTML y JavaScript que No funciona como se esperaba.

2
Community 23 may. 2017 a las 11:47