Xử lý sự kiện thay đổi URL trong js

Question

Làm cách nào để tôi có thể viết mã gọi lại JavaScript sẽ được thực hiện trên bất kỳ thay đổi nào trong URL neo?

Ví dụ http://example.com#a-http://example.com#b

Answer 1

Công cụ tìm kiếm tùy chỉnh của Google sử dụng bộ hẹn giờ để kiểm tra giá trị trước đó, trong khi khung nội tuyến con trên miền riêng biệt cập nhật băm vị trí của cha mẹ để chứa kích thước nội dung của tài liệu iframe. Khi bộ đếm thời gian bắt sự thay đổi, phụ huynh có thể thay đổi kích thước khung nội tuyến để khớp với khung nội tuyến để thanh cuộn không được hiển thị.

giống như sau đạt được như nhau:

var storedHash = window.location.hash; 
window.setInterval(function() { 
    if (window.location.hash != storedHash) { 
     storedHash = window.location.hash; 
     hashChanged(storedHash); 
    } 
}, 100); // Google uses 100ms intervals I think, might be lower 

Google Chrome 5, Safari 5, Opera 10.60, Firefox 3.6 và Internet Explorer 8tất cả hỗ trợ sự kiện hashchange:

if ("onhashchange" in window) // does the browser support the hashchange event? 
    window.onhashchange = function() { 
     hashChanged(window.location.hash); 
    } 

và đặt nó lại với nhau :

if ("onhashchange" in window) { // event supported? 
    window.onhashchange = function() { 
     hashChanged(window.location.hash); 
    } 
} 
else { // event not supported: 
    var storedHash = window.location.hash; 
    window.setInterval(function() { 
     if (window.location.hash != storedHash) { 
      storedHash = window.location.hash; 
      hashChanged(storedHash); 
     } 
    }, 100); 
} 

jQuery cũng có một plugin sẽ kiểm tra sự kiện băm và tự cung cấp nếu cần - http://benalman.com/projects/jquery-hashchange-plugin/.

EDIT: Hỗ trợ trình duyệt được cập nhật (lại).

Answer 2

Từ những gì tôi nhìn thấy trong SO câu hỏi khác, chỉ có giải pháp qua trình duyệt hoàn toàn khả thi là một bộ đếm thời gian. Hãy xem ví dụ this question.

Answer 3

Bạn có thể nhận biết thêm từ này

Mutation event types

Các đột biến mô-đun Sự kiện này được thiết kế để cho phép thông báo về bất kỳ thay đổi đến cấu trúc của một tài liệu, bao gồm attr và văn bản sửa đổi.

Answer 4

setInterval() hiện chỉ là giải pháp phổ quát. Nhưng có một số ánh sáng trong tương lai theo hình thức hashchange event

Answer 5

(Chỉ cần cho các hồ sơ.) Các YUI3 "hashchange" sự kiện tổng hợp thực hiện nhiều hay ít điều tương tự như câu trả lời chấp nhận

YUI().use('history-hash', function (Y) { 
    Y.on('hashchange', function (e) { 
    // Handle hashchange events on the current window. 
    }, Y.config.win); 
});