Javascript: возможно ли возвращать false на элементе привязки, но при этом обновлять URL без каких-либо резких движений?

Question

В приведенном ниже коде при щелчке элемента привязки я пытаюсь обновить URL с помощью ссылки 'href' и прокрутить вниз до соответствующего идентификатора:

jQuery(document).ready(function($) {
(function() {
    function update_url(id, url, scroll) {
            this.id = id;
            this.url = url;
            this.scroll = scroll;
            this.update();
    }

    update_url.prototype.update = function() {
        var url = this.url;
        $(this.id).click(function() {
            var append = $(this).attr('href');
            testing.scrollTo();
            document.location.href = url + append;
            return false;
        });
    }

    update_url.prototype.scrollTo = function() {
        $('html,body').animate({
            scrollTop: $("#" + this.scroll).offset().top
        },'slow');
    }

    var testing = new update_url('a', document.URL, 'people');  
    })(); });

Проблема в том, что при нажатии на якорь return false; не срабатывает достаточно быстро, поэтому страница дергается на секунду перед прокруткой вниз.

Есть ли способ обновить URL страницы и при этом избежать этого резкого движения?

Answer 1

Проблема не в том, что return false; срабатывает слишком поздно, а в том, что изменение, которое вы вносите в document.location.href, вызывает перезагрузку страницы, несмотря ни на что.

• HTML5 pushState - это то, что вы ищете.Если вы используете HTML5, то есть.
• Если нет, вам нужно прибегнуть к для хеширования .

Также есть aплагин для этого, конечно. Он поддерживает pushState, а также навигацию по хэшам - вам не о чем беспокоиться.