Как получить привязку от URL с помощью jQuery?

184

У меня есть URL, который похож на:

www.example.com/task1/1.3.html#a_1

Как я могу получить a_1значение привязки с помощью jQuery и сохранить его как переменную?

javascript jquery url anchor zjm1126
источник

Ответы:

207

Вы можете использовать .indexOf()и .substring(), как это:

var url = "www.aaa.com/task1/1.3.html#a_1";
var hash = url.substring(url.indexOf("#")+1);

Вы можете попробовать его здесь , если он может не содержать #его, выполните if(url.indexOf("#") != -1)проверку следующим образом:

var url = "www.aaa.com/task1/1.3.html#a_1", idx = url.indexOf("#");
var hash = idx != -1 ? url.substring(idx+1) : "";

Если это URL текущей страницы, вы можете просто использовать его window.location.hashдля получения и заменить, #если хотите.

Ник Крейвер
источник
10
Обратите внимание: чтобы получить значение хеш-функции главного окна внутри iFrame, вы должны использовать window.top.location.hashвместо этого.
Паоло Стефан
1
url.split("#").pop() - Медленнее, но легче.
Ifch0o1
490

Для текущего окна вы можете использовать это:

var hash = window.location.hash.substr(1);

Чтобы получить значение хеша главного окна , используйте это:

var hash = window.top.location.hash.substr(1);

Если у вас есть строка с URL / хэшем, самый простой способ:

var url = 'https://www.stackoverflow.com/questions/123/abc#10076097';
var hash = url.split('#').pop();

Если вы используете jQuery, используйте это:

var hash = $(location).attr('hash');
Сильвио Дельгадо
источник
1
Элегантный ответ. Есть ли случаи, когда это не работает?
sscirrus
2
укороченная версия - var hash = window.location.hash.substr(1);из-за JS есть обе функции substr / substring, они разные, но в этом случае одинаковые.
Артур Кушман
Каков наилучший способ отслеживать изменения этого, т.е. кто-то нажал на ссылку на внутренней странице?
Rid Iculous
5
@RidIculous попробуйте это: $ (window) .on ('hashchange', function () {$ ('h1'). Text (location.hash.slice (1));});
Сильвио Дельгадо
71

использование 

window.location.hash

чтобы получить все, кроме и в том числе #

реальный
источник
15
Не забудьте использовать, location.hash.slice(1)если вам не нужен хеш-тег в последней строке!
Сэнди Гиффорд
39

JQuery стиль:

$(location).attr('hash');
Валентин Е
источник
7
Не каждая проблема JavaScript должна быть решена с помощью jquery.
Doxin
22
@doxin Я согласен, но вопрос в том, «Как получить привязку от URL с помощью jQuery?»
Валентин Е
10

Вы можете использовать следующий «трюк» для разбора любого действительного URL. Он использует преимущество специального свойства href элемента привязки ,hash .

С помощью jQuery

function getHashFromUrl(url){
    return $("<a />").attr("href", url)[0].hash.replace(/^#/, "");
}
getHashFromUrl("www.example.com/task1/1.3.html#a_1"); // a_1

С простой JS

function getHashFromUrl(url){
    var a = document.createElement("a");
    a.href = url;
    return a.hash.replace(/^#/, "");
};
getHashFromUrl("www.example.com/task1/1.3.html#a_1"); // a_1
Дэвид Мердок
источник
3

Если у вас есть простая строка URL-адреса (и, следовательно, у вас нет атрибута hash), вы также можете использовать регулярное выражение:

var url = "www.example.com/task1/1.3.html#a_1"  
var anchor = url.match(/#(.*)/)[1]
DrewB
источник
1
Необходимо проверить, что совпадение получает результаты, прежде чем получить доступ ко второму его элементу, иначе этот код выдаст ошибку, если в URL нет привязки.
Ричард Гарсайд