Как передать объект jquery в history.pushState

Question

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

Когда я делаю это, я получаю ошибку:

Компонент возвратил код ошибки: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIDOMHistory.pushState]

Если я изменяюСелектор строки, затем ошибка исчезает ... Но мне нужен объект jQuery, чтобы я мог нажать на него по событию "popstate": s

Answer 1

Данные в состоянии истории должны быть сериализуемыми. То есть он должен быть конвертируемым в JSON. $(this) возвращает массивоподобный объект с узлами DOM, которые нельзя преобразовать в JSON. Вы должны искать другой способ сделать то, что вы ищете.

Помните, что состояние push является просто полезной информацией и не должно быть каноническим. Если пользователь не может получить точно такой же контент, скопировав и вставив URL-адрес в адресную строку, возникла проблема.

Answer 2

Вы можете сохранить ссылку на (не сериализуемый) расширенный объект, а затем извлечь его по ссылке.

Смотрите краткое демо:

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] ​

Answer 3

Расширяя ответ Брайана Никеля и Грегла, вы можете решить это, выполнив $ ('#' + this.id) .attr ('href') ... ... пока вы идентифицируете DOM, как предложили оба парняпередо мной.

Иногда я получаю желаемый результат только по:

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

, и это позволяет мне быть более креативным в своей идее, где, например, я мог бы получить $('#'+this.id+'*locator*');

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

Answer 4

Рассмотрите возможность присвоения идентификатора или другого уникального атрибута узлу DOM, который представлен объектом jQuery, тогда вы можете просто сохранить значение этого идентификатора в вашем объекте данных в виде строки, которая сериализуема.

Если элемент не имеет уникального идентификатора, рассмотрите возможность его создания и добавления к элементу.