Как добавить ссылку на хеш-код HTML без изменения строки URL-адреса ...?

Question

Когда я добавляю HTML-ссылку на определенную часть страницы:

<a href="#specific">test</a>

Я заметил, что это меняет URL в адресной строке. Хотя я сталкивался с сайтами, где они ссылаются таким образом, без обновления адресной строки. Как это возможно?

РЕДАКТИРОВАТЬ: Это может быть решение AJAX, если они заставляют его работать без изменения URL, как будто я правильно помню, страница не перезагружалась, она шла прямо к месту назначения ...

Answer 1

Возможно, вы захотите взглянуть на плагин jquery, scrollTo.

http://jquery.com

И пару ссылок для scrollTo

http://demos.flesler.com/jquery/scrollTo/

http://flesler.blogspot.com/2007/10/jqueryscrollto.html

Вы можете сделать что-то вроде этого:

HTML

<a href="#scrollToMe" class="scrollLink">click me to scroll</a>
<div class="gap">a big gap</div>
<h1 id="scrollToMe">I should scroll to here without a # in the URL</h1>

Javascript (JQuery иплагин scrollto)

$(document).ready(function() {
    $(".scrollLink").click(function(e) {

        $.scrollTo($(this).attr("href"));    
        e.preventDefault();

    });

});

Что делает javascript, это когда при нажатии на ссылку, имеющую класс ".scrollLink", прокрутите страницу вниз до элемента с таким же идентификатором, какссылка на конкретную ссылку нажата.Затем e.preventDefault () перестает работать как обычная хеш-ссылка и перестает отображаться в строке URL.

Вот рабочий пример для вас: http://jsfiddle.net/alexkey/c3jsY/7/

И версияне в наборе фреймов, поэтому вы можете видеть, что URL не меняется:

http://fiddle.jshell.net/alexkey/c3jsY/7/show/light/

Этот подход имеет несколько хороших моментов

1. Простоприменить класс scrollLink к ссылкам, которые вы хотите, чтобы хеш не появлялся (красиво и просто)
2. Он использует обычный href, что также означает, что ссылки будут работать, даже если javascript отключен - хорошо для доступности и, вероятно, поискаоптимизация двигателя до.

Answer 2

Может быть, вы можете попробовать что-то вроде: window.scroll (0,150);вместо "(0,150)" укажите координату вашей цели.

Answer 3

Вам придется поэкспериментировать с числом (показанным здесь как 200), чтобы окно выровнялось правильно.

<a href="javascript:void(0);" onclick="window.scroll(0,200);">test</a>

Answer 4

Можно использовать javascript для перехвата события click, выполнить собственную настраиваемую логику, а затем отменить событие навигации, чтобы URL никогда не менялся