jquery - anexar/eliminar el nombre del ancla de la URL actual sin actualizar

append anchor

Question

Quiero que en el evento haga clic para anexar / eliminar el nombre del anclaje "#on" que se agregará a la url actual sin volver a cargar la página, o use href = ''# on'' de los enlaces porque hace que mi página salte

Ejemplo: http://www.example.com/page.html#on para que pueda detectar a los usuarios que provienen de esa url y llamar a la función On ()

function On()
{
//append to current url the anchor "#on"
}
function Off()
{
//remove from the current url the anchor "#on"
}
$(''.on'').live(''click'', function() {
On();
return false;
});
$(''.off'').live(''click'', function() {
Off();
return false;
});

Answer 1

Realmente no necesitas jQuery para eso, puedes obtener / establecer el nombre del ancla usando location.hash . Si lo coloca en su función jQuery ready, puede realizar alguna acción si se establece en un valor determinado:

$(function(){
// Remove the # from the hash, as different browsers may or may not include it
var hash = location.hash.replace(''#'','''');
if(hash != ''''){
// Show the hash if it''s set
alert(hash);
// Clear the hash in the URL
location.hash = '''';
}
});

Tenga en cuenta que al eliminar el hash, el # final podría permanecer en la barra de direcciones. Si desea responder a cambios en vivo del anclaje, puede enlazar una devolución de llamada al evento hashchange :

$(document).bind("hashchange", function(){
// Anchor has changed.
});

Si desea evitar que su página salte a la parte superior cuando borre el anclaje, puede enlazar el evento hashchange para saltar a la posición de desplazamiento anterior. Mira este ejemplo: http://jsfiddle.net/yVf7V/

var lastPos = 0;
$(''#on'').click(function(){
location.hash = ''blah'';
});
$(''#off'').click(function(){
lastPos = $(window).scrollTop();
location.hash = '''';
});
$(window).bind(''hashchange'',function(event){
var hash = location.hash.replace(''#'','''');
if(hash == '''') $(window).scrollTop(lastPos);
alert(hash);
});

Answer 2

si está usando jquery pruebe este código

$("a[href^=#]").on("click", function(e) {
e.preventDefault();
history.pushState({}, "", this.href);
});