jQuery "window.location.hash" - получить хеш слишком поздно? - PullRequest
2 голосов
/ 20 августа 2010

Я работаю над некоторым сценарием, но у него серьезные проблемы с хешами.

У меня есть список ссылок-изображений, таких как:

<a href="#1"><img src="1.jpg" /></a>
<a href="#1"><img src="2.jpg" /></a>
<a href="#1"><img src="3.jpg" /></a>

Все, что я хочу сделать, это загрузить файлы file / # 1.html после нажатия на первое изображение, файлы / # 2.html после второго и т. Д.

Вот моя функция jQuery:

$("a img").click(
function()
{  
        var hash = window.location.hash;
        $("#displayFile").load('files/'+ hash +'.html');
        $("#displayFile ").fadeIn(300);  
 });  

Поэтому, когда я нажимаю на изображение, оно должно добавить хэш к URL (href = "# 1"), загрузить нужный файл в #displayFile div и добавить его в.

Но на самом деле, когда я нажимаю на изображение, он показывает пустой div #displayFile и после того, как я обновляю сайт с таким же хешем, он загружает контент. Я считаю, что скрипт получает хэш задолго до того, как он появится в URL.

Как это исправить?

Спасибо.

Ответы [ 3 ]

4 голосов
/ 20 августа 2010

Обработчики событий запускаются перед действиями по умолчанию. Если не считать неприятных трюков, связанных с setTimeout, вы не сможете получить ссылку, по которой следует перейти до завершения функции.

Вместо this.href.

Тем не менее, звучит так, как будто вы используете произвольные идентификаторы фрагментов вместо URI для разумных вещей. Если так: я бы исправил href, чтобы он указывал на реальный URL, который загружает изображение. Основывайтесь на том, что работает .

2 голосов
/ 20 августа 2010

При нажатии на ссылку код будет выполнен в следующем порядке:

  • обработчики кликов jQuery
  • OnClick-обработчики
  • Собственное поведение / поведение по умолчанию (вызов ссылки, запись в window.location)

Я бы порекомендовал вам использовать this.href. Также используйте e.preventDefault(), чтобы браузер не выполнял стандартное / стандартное поведение.

0 голосов
/ 20 августа 2010

Поскольку событие по умолчанию, изменяющее location.hash, еще не произошло, вместо этого вы можете напрямую извлечь .hash из якоря, например:

$("a img").click(function() {  
  var hash = this.parentNode.hash;
  $("#displayFile").load('files/'+ hash +'.html').fadeIn(300);  
});  

Хотя, поскольку изображение является единственным, вы можете прикрепить обработчик к самому <a>, вот так:

$("a").click(function() { 
  $("#displayFile").load('files/'+ this.hash +'.html').fadeIn(300);  
});  
...