Функция JavaScript, ломающая мою глубокую ссылку в сканировании адресов jQuery - PullRequest
Новая
       2

Функция JavaScript, ломающая мою глубокую ссылку в сканировании адресов jQuery

0 голосов
/ 19 февраля 2011

Странное поведение JavaScript с jQuery Address (плагин).

У меня есть этот код: 

var handler = function(data) {
$('#conteudo').hide().html($('#conteudo', data).html()).fadeIn(500);
$.address.title(/>([^<]*)<\/title/.exec(data)[1]);
};

И это работает. Прекрасно.

Теперь я меняю код: 

var handler = function(data) {
$('#conteudo').fadeOut(500, function() {
    $('#conteudo').html($('#conteudo', data).html()).fadeIn(500);
});
$.address.title(/>([^<]*)<\/title/.exec(data)[1]);
};

Теперь эффект затухания работает и после появления (с новым содержимым). Красивая! Но это небольшое изменение в способе написания нового контента (внутри новой функции, после fadeOut) сломало мои суб-ссылки внутри моих страниц.

Вот живой пример:

  1. Доступ к этому URL: http://impulse.im/clean/2/
  2. В верхнем меню нажмите «Contato».
  3. Теперь посмотрите href ссылки 'Rafa' в загруженном контенте!
    http://impulse.im/clean/2?_escaped_fragment_=%2Fcontato%2Frafa.
    Это не правильно: должно читаться
    http://impulse.im/clean/2/#!/contato/rafa
  4. Снова: http://impulse.im/clean/2/ - Нажмите «Contato». Теперь ЗАГРУЗИТЕ страницу.
  5. Ссылка 'Rafa' теперь верна.

Что эта новая функция (после fadeOut) делает с кодом? Почему эта функция ломает мою ссылку?

Спасибо!

1 Ответ

1 голос
/ 19 февраля 2011

Проблема в том, что вы вызываете адресный плагин до того, как HTML, сохраненный в данных, будет фактически размещен на странице. Это происходит потому, что вы вызываете $('#conteudo').html($('#conteudo', data).html()).fadeIn(500) асинхронно, так как он вызывается как обратный вызов метода fadeOut.

Измените это так: 

var handler = function(data) {
    $('#conteudo').fadeOut(500, function() {
        $('#conteudo').html($('#conteudo', data).html()).fadeIn(500);
        $.address.title(/>([^<]*)<\/title/.exec(data)[1]);
    });
};

Это вызовет плагин вашего адреса после размещения нового контента на странице.

До того как все заработало.

Обработчик

возвращает данные -> содержимое исчезает -> вы вызываете плагин адреса, но содержимое еще не размещено на странице -> через 500 мс вызывается обратный вызов, добавляющий содержимое.

Теперь это будет так.

Обработчик

возвращает данные -> контент исчезает -> через 500 мс контент добавляется и адресный плагин называется

...