Получение местоположения хэша URL и его использование в jQuery

Question

Получение местоположения хэша URL и его использование в jQuery

Я хотел бы получить значение после хэша в URL текущей страницы, а затем иметь возможность применить это в новой функции... например.

URL может быть

www.example.com/index.html#foo

и я хотел бы использовать это в сочетании со следующим фрагментом кода

$('ul#foo:first').show();

Я как бы предполагаю / надеюсь, что есть какой-то способ схватить это и превратить его в переменную, которую я могу использовать во втором фрагменте кода.

685 5

jQuery hash url fragment-identifier

5 ответов:

Comments

Ничего не найдено.

CMS · Accepted Answer · 2017-11-19 02:14:45

Примечание редактора: ниже подход серьезные последствия для безопасности и, в зависимости от версии jQuery, которую вы используете, может подвергать ваших пользователей атакам XSS. Более подробно см. обсуждение возможной атаки в комментариях к этому ответу или это объяснение на Security Stack Exchange.

можно использовать location.hash свойство, чтобы захватить хэш текущая страница:
var hash = window.location.hash;
$('ul'+hash+':first').show();
обратите внимание, что это свойство уже содержит # символ в начале.

на самом деле вам не нужны :first псевдо-селектор, так как вы используете ID-селектор, предполагается, что идентификаторы уникальный внутри DOM.

в случае, если вы хотите получить хэш из строки URL, вы можете использовать String.substring способ:
var url = "http://example.com/file.htm#foo";
var hash = url.substring(url.indexOf('#')); // '#foo'
Совет: будьте в курсе что пользователь можете изменить хэш, как он хочет, вводя что-нибудь в селектор, вы должны проверить хэш перед его использованием.

Deepak Patil · Accepted Answer · 2012-12-04 14:52:46

расположение.хэш не является безопасным для IE, в случае IE ( включая IE9), если ваша страница содержит iframe, то после ручного обновления внутри содержимого iframe получите местоположение.хэш-значение является старым (значение для загрузки первой страницы ). хотя полученное вручную значение отличается от местоположения.хэш так всегда получить его через документ.URL
var hash = document.URL.substr(document.URL.indexOf('#')+1) 

Matas Vaitkevicius · Accepted Answer · 2016-06-13 13:49:15

для тех, кто ищет чистое решение javascript
 document.getElementById(location.hash.substring(1)).style.display = 'block'
надеюсь, это сэкономит вам некоторое время.

Chetabahana · Accepted Answer · 2018-05-15 19:37:47

Я бы предложил лучше cek сначала, если текущая страница имеет хэш. Иначе это будет undefined.
$(window).on('load', function(){        
    if( location.hash && location.hash.length ) {
       var hash = decodeURIComponent(location.hash.substr(1));
       $('ul'+hash+':first').show();;
    }       
});

j08691 · Accepted Answer · 2018-10-03 20:39:06

начиная с jQuery 1.9,:target селектор будет соответствовать хэшу URL. Так что вы могли бы сделать:
$(":target").show(); // or $("ul:target").show();
что бы выбрать элемент с ID, соответствующим хэш и показать его.