создание вкладок пользовательского интерфейса jQuery закладок

Question

Мне показалось немного странным, что вкладки пользовательского интерфейса jQuery не имеют встроенного метода удобства для закладки вкладок (изменение хеша URL). Следующий фрагмент кода вроде работает для меня

$("#tabs").tabs({ 
    "activate": function(event, ui) { 
     window.location.hash = ui.newTab.context.hash; 
    } 
}); 

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

Обновление: Для большей ясности, я не привязана к моему коду выше. Меня просто интересует возможность изменения адресной строки URL-адреса с идентификатором выбранной вкладки, чтобы пользователь мог добавлять закладки или связывать вкладку.

Answer 1

Замена window.location.hash (которая обновляет страницу) с помощью истории HTML5 (которая управляет адресной строкой URL-адреса и стеком истории браузера без обновления страницы) сделала трюк для меня. Следующий код работает для меня

$("#tabs").tabs({ 
    "activate": function(event, ui) { 
     var url = window.location; 
     window.history.pushState({ 
      "html": "", 
      "pageTitle": title, 
     }, "", url.href.replace(url.hash, "") + ui.newTab.context.hash); 
    } 
}); 

Answer 2

Вы можете просто сохранить текущее расстояние по вертикали прокрутки вверх страницы и повторно применить его потом, как это:

$("#tabs").tabs({ 
    "activate": function(event, ui) {'use strict'; 
     var scrollTop; 

     scrollTop = $(document).scrollTop(); 
     window.location.hash = ui.newTab.context.hash; 
     $(document).scrollTop(scrollTop); 
    } 
});