Изменить хэш без перезагрузки в JQuery

У меня есть следующий код:Изменить хэш без перезагрузки в JQuery

$('ul.questions li a').click(function(event) { 
    $('.tab').hide(); 
    $($(this).attr('href')).fadeIn('slow'); 
    event.preventDefault(); 
    window.location.hash = $(this).attr('href'); 
});

Это просто замирает на DIV в основе, когда вы щелкаете, но я хочу, чтобы страница URL хэш-тег для изменения при нажатии кнопки, чтобы люди могли скопировать и пометить его. На данный момент это эффективно перезагружает страницу при изменении хэш-тега.

Можно ли изменить хэш-тег и не перезагружать страницу, чтобы предотвратить эффект прыжка?

источник

2009-12-21 daveredfern

Я побежал следующий на этой текущей странице, и это было именно то, что вы хотите (без перезагрузки страницы): $ ("A") нажмите кнопку (функция (событие) {event.preventDefault(); окно.. location.hash = $ (this) .attr ('href');}). Может быть, в момент, когда ваш код работает, страница еще не загружена? Проверьте, сколько элементов находится в '$ ('ul.questions li a')' –

Это работает для меня

$('ul.questions li a').click(function(event) { 
    event.preventDefault(); 
    $('.tab').hide(); 
    window.location.hash = this.hash; 
    $($(this).attr('href')).fadeIn('slow'); 
});

http://jsbin.com/edicu Проверьте здесь для демо с почти идентичной кодой

источник

2009-12-21 11:47:33 jitter

Привет, Да, он работает, но когда страница прокручивается, он переходит в div при изменении хеш-ссылки. – daveredfern

Проверьте измененный код, который исправляет это. Если вы не хотите, чтобы это произошло, вам просто нужно переключить последние две строки. Первоначальный заказ был вашим, и я сохранил его таким образом, потому что я думал, что это то, что вы хотели – jitter

Спасибо :) Отличная работа. – daveredfern

Вы можете попробовать поймать событие onload. И прекращение распространения зависит от некоторого флага.

var changeHash = false; 

$('ul.questions li a').click(function(event) { 
    var $this = $(this) 
    $('.tab').hide(); //you can improve the speed of this selector. 
    $($this.attr('href')).fadeIn('slow'); 
    StopEvent(event); //notice I've changed this 
    changeHash = true; 
    window.location.hash = $this.attr('href'); 
}); 

$(window).onload(function(event){ 
    if (changeHash){ 
     changeHash = false; 
     StopEvent(event); 
    } 
} 

function StopEvent(event){ 
    event.preventDefault(); 
    event.stopPropagation(); 
    if ($.browser.msie) { 
     event.originalEvent.keyCode = 0; 
     event.originalEvent.cancelBubble = true; 
     event.originalEvent.returnValue = false; 
    } 
}

Не тестировался, так что не может сказать, если он будет работать

источник

2009-12-21 09:33:31

для одного, вам нужно передать локальную переменную «event» в «StopEvent» –

К сожалению. Спасибо, отредактировал соответственно. –

Спасибо, что это даст вам вихрь. – daveredfern

Принятыми ответ не работал для меня, так как моя страница слегка подпрыгивала, щелкая мою анимацию прокрутки.

Я решил обновить весь URL-адрес, используя window.history.replaceState, а не используя метод window.location.hash. Таким образом, обход события hashChange, запущенного браузером.

// Only fire when URL has anchor 
$('a[href*="#"]:not([href="#"])').on('click', function(event) { 

    // Prevent default anchor handling (which causes the page-jumping) 
    event.preventDefault(); 

    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 

     if (target.length) {  
      // Smooth scrolling to anchor 
      $('html, body').animate({ 
       scrollTop: target.offset().top 
      }, 1000); 

      // Update URL 
      window.history.replaceState("", document.title, window.location.href.replace(location.hash, "") + this.hash); 
     } 
    } 
});

источник

2017-03-29 23:59:20 Swen

Изменить хэш без перезагрузки в JQuery

ответ

Смежные вопросы