Làm thế nào để vượt qua đối tượng jquery để history.pushState

Question

var data = { url: $(this).attr('href'), selector: $(this) }; 
history.pushState(data, 'foo', $(this).attr('href')); 

Khi tôi làm điều này tôi nhận được một lỗi:

Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIDOMHistory.pushState]

Nếu tôi thay đổi selector vào một chuỗi, sau đó các lỗi biến mất ... Nhưng tôi cần đối tượng jQuery, vì vậy tôi có thể kích hoạt nhấp vào nó trên sự kiện "popstate": s

Answer 1

Mở rộng trên cả câu trả lời của Brian Nickel và GregL, bạn có thể giải quyết điều đó bằng cách thực hiện $ ('#' + this.id) .attr ('href') ... miễn là bạn ID DOM theo đề xuất của cả hai mọi người trước tôi.

Đôi khi tôi chỉ nhận được kết quả tôi muốn bằng cách:

var $this = $('#'+this.id); //.... before hand ... 

và nó cho phép tôi có nhiều sáng tạo với tôi id-ing ở đâu, ví dụ, tôi có thể có $('#'+this.id+'*locator*');

... id='abGGFather' 
... id='abGFather' 
... id='abFather' 
... id='ab' 

Answer 2

Dữ liệu trong trạng thái lịch sử phải được tuần tự hóa. Tức là, nó phải được chuyển đổi thành JSON. $(this) trả về một đối tượng giống như mảng với các nút DOM không thể chuyển đổi thành JSON. Bạn nên tìm một cách khác để làm những gì bạn đang tìm kiếm.

Hãy nhớ rằng trạng thái đẩy là chỉ thông tin hữu ích và không có nghĩa là kinh điển. Nếu người dùng không thể nhận được cùng một nội dung chính xác bằng cách sao chép và dán URL vào thanh địa chỉ bạn gặp sự cố.

Answer 3

Xem xét gán ID hoặc thuộc tính duy nhất khác cho nút DOM được đại diện bởi đối tượng jQuery, sau đó bạn có thể lưu trữ giá trị của ID đó trong đối tượng dữ liệu dưới dạng chuỗi.

Nếu phần tử không có ID duy nhất, hãy xem xét tạo một ID và thêm phần tử đó vào phần tử.

Answer 4

Bạn có thể lưu trữ một tham chiếu đến một đối tượng giàu (un-serializable) và sau đó truy xuất nó bằng cách tham chiếu.

Xem một bản demo nhanh:

var historyStateReference = { 
    url1:{/*richobj*/}, 
    url2:{/*richobj*/}  
} 
var serializableObj = { 
    richObjRef = "url1", 
    //otherProps 
} 


// pushState with a simple serializable Object 
history.pushState(serializableObj, null, "newPath"); 



// then later refrence it via history.state 
historyStateReference[history.state.richObjRef] ​