วิธีรับจุดยึดจาก URL โดยใช้ jQuery


184

ฉันมี URL ที่เป็นเหมือน:

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

ฉันจะรับa_1ค่าจุดยึดโดยใช้ jQuery และเก็บไว้เป็นตัวแปรได้อย่างไร

คำตอบ:


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 มีทั้งฟังก์ชันย่อย / ซับสตริงจึงแตกต่างกัน แต่ในกรณีนี้จะเหมือนกัน
Arthur Kushman

อะไรคือวิธีที่ดีที่สุดในการติดตามการเปลี่ยนแปลงนี้คือ มีคนคลิกลิงค์หน้าชั้นใน?
กำจัด Iculous

5
@RidIculous ลองนี้: $ (หน้าต่าง) .on ('hashchange', function () {$ ('h1'). ข้อความ (location.hash.slice (1));});
Silvio Delgado

71

ใช้

window.location.hash

เพื่อดึงข้อมูลทุกอย่างที่เกินและรวมถึง #


15
จำไว้ว่าให้ใช้location.hash.slice(1)ถ้าคุณไม่ต้องการแฮชแท็กในสตริงสุดท้าย!
Sandy Gifford

39

สไตล์ jQuery:

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

7
ไม่ใช่ทุกปัญหาของ javascript ที่จะต้องแก้ไขด้วย jquery
doxin

22
@doxin ฉันเห็นด้วย แต่คำถามคือ "วิธีการรับสมอจาก URL โดยใช้ jQuery?"
Valentin E

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] 

1
จำเป็นต้องตรวจสอบว่าการจับคู่นั้นได้ผลลัพธ์ก่อนที่จะเข้าถึงองค์ประกอบที่สองของมันหรือรหัสนี้จะเกิดข้อผิดพลาดหาก URL ไม่มีสมอ
Richard Garside
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.