Bagaimana cara mendapatkan jangkar dari URL menggunakan jQuery?

184

Saya memiliki URL yang seperti:

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

Bagaimana saya bisa mendapatkan nilai a_1jangkar menggunakan jQuery dan menyimpannya sebagai variabel?

— zjm1126
sumber

207

Anda dapat menggunakan .indexOf()dan .substring(), seperti ini:

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

Anda dapat mencobanya di sini , jika mungkin tidak ada #di dalamnya, lakukan if(url.indexOf("#") != -1)pemeriksaan seperti ini:

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

Jika ini adalah URL halaman saat ini , Anda bisa menggunakannya window.location.hashuntuk mendapatkannya, dan ganti #jika Anda mau.

— Nick Craver
sumber

10

Harap dicatat: untuk mendapatkan nilai hash dari jendela utama dari dalam iFrame, Anda harus menggunakannya window.top.location.hash.

— Paolo Stefan

1

url.split("#").pop() - Lebih lambat tapi lebih mudah.

— Ifch0o1

490

Untuk jendela saat ini , Anda dapat menggunakan ini:

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

Untuk mendapatkan nilai hash dari jendela utama , gunakan ini:

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

Jika Anda memiliki string dengan URL / hash, metode termudah adalah:

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

Jika Anda menggunakan jQuery, gunakan ini:

var hash = $(location).attr('hash');

— Silvio Delgado
sumber

1

Jawaban elegan. Apakah ada kasus di mana ini tidak berhasil?

— sscirrus

2

versi pintasan - var hash = window.location.hash.substr(1);karena JS memiliki kedua fungsi substr / substring, keduanya berbeda, tetapi dalam hal ini sama.

— Arthur Kushman

apa cara terbaik untuk melacak perubahan ini, yaitu. seseorang mengklik tautan halaman-dalam?

— Singkirkan Iculous

5

@RidIculous coba ini: $ (window) .on ('hashchange', function () {$ ('h1'). Text (location.hash.slice (1));});

— Silvio Delgado

71

Menggunakan

window.location.hash

untuk mengambil semuanya di luar dan termasuk #

— Nyata
sumber

15

Ingatlah untuk menggunakan location.hash.slice(1)jika Anda tidak ingin tag hash di string terakhir!

— Sandy Gifford

39

gaya jQuery:

$(location).attr('hash');

— Valentin E
sumber

7

tidak setiap masalah javascript perlu diselesaikan dengan jquery.

— doxin

22

@doxin Saya setuju tetapi pertanyaannya adalah "Bagaimana cara mendapatkan jangkar dari URL menggunakan jQuery?"

— Valentin E

10

Anda dapat menggunakan "trik" berikut untuk mem - parsing URL yang valid. Ini mengambil keuntungan dari properti yang berhubungan dengan href khusus elemen anchorhash ,.

Dengan jQuery

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

Dengan JS polos

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

— David Murdoch
sumber

3

Jika Anda hanya memiliki string url biasa (dan karena itu tidak memiliki atribut hash) Anda juga dapat menggunakan ekspresi reguler:

var url = "www.example.com/task1/1.3.html#a_1"  
var anchor = url.match(/#(.*)/)[1]

— DrewB
sumber

1

Perlu memeriksa bahwa kecocokan mendapatkan hasil sebelum mengakses elemen kedua, atau kode ini akan salah jika url tidak memiliki jangkar.

— Richard Garside