ajax загружать контент с якорной ссылкой? живой обработчик?

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

<a href="#someIDonHomepage">anchorlink</a>

Моя домашняя страница, на которой запущен запрос ajax, имеет этот div #someIDonHomepage, и я хочу, чтобы моя страница перешла на эту позицию.

Однако, поскольку я загружаю якорь с помощью ajax, это не работает.

любая идея, как я мог решить это?

Я написал этот анимированный скрипт прокрутки с помощью jquery, который анимирует прыжок при нажатии на якоря.

/*Animated scroll for anchorlinks*/
    var anchor = '',
        pageOffset = '',
        viewOffset = 30,
        scrollPos = '';
    $(function() {
        $("a[href*='#']").each(function() {
            $(this).addClass('anchorLink');
            $(this).bind('click', function(e) {
                e.preventDefault();
                anchor = $(this).attr('href').split('#')[1];
                pageOffset = $("a[name='#"+anchor+"']").offset();
                scrollPos = pageOffset.top - viewOffset;
                $('html, body').animate({scrollTop:scrollPos}, '500');
            })      
        });
    });

Есть идеи, как я могу это решить? благодарю вас


scroll jquery ajax hashchange fragment-identifier
person matt    schedule 04.01.2011    source источник
comment
Однако, поскольку я загружаю якорь с помощью ajax, это не работает. Как вы загружаете свой якорь с помощью ajax?   -  person andres descalzo    schedule 04.01.2011
comment
Я просто загружаю div с текстом и привязкой с помощью метода jquery load().   -  person matt    schedule 05.01.2011

Ответы (2)


arrow_upward
2
arrow_downward

В jQuery Ajaxy встроена поддержка использования ajax с хэшами, а также обратная поддержка традиционных привязок — щелкните вкладку durian в демонстрации.

http://balupton.com/sandbox/jquery-ajaxy/demo/

person balupton    schedule 05.01.2011

arrow_upward
1
arrow_downward

Вы можете использовать LearningJquery. или даже использовать их плагин напрямую.
Пример их подхода.

$(document).ready(function() {
  var viewOffset = 30;
  function filterPath(string) {
  return string
 .replace(/^\//,'')
 .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
 .replace(/\/$/,'');
  }
  var locationPath = filterPath(location.pathname);
  var scrollElem = scrollableElement('html', 'body');
  $('a[href*=#]').each(function() {
 var thisPath = filterPath(this.pathname) || locationPath;
 if (  locationPath == thisPath
 && (location.hostname == this.hostname || !this.hostname)
 && this.hash.replace(/#/,'') ) {
   var $target = $(this.hash), target = this.hash;
   if (target) {
  var targetOffset = $target.offset().top - viewOffset;
  $(this).click(function(event) {
    event.preventDefault();
    $(scrollElem).animate({scrollTop: targetOffset}, 400, function() {
   location.hash = target;
    });
  });
   }
 }
  });
  // use the first element that is "scrollable"
  function scrollableElement(els) {
 for (var i = 0, argLength = arguments.length; i <argLength; i++) {
   var el = arguments[i],
    $scrollElement = $(el);
   if ($scrollElement.scrollTop()> 0) {
  return el;
   } else {
  $scrollElement.scrollTop(1);
  var isScrollable = $scrollElement.scrollTop()> 0;
  $scrollElement.scrollTop(0);
  if (isScrollable) {
    return el;
  }
   }
 }
 return [];
  }
});
person ifaour    schedule 04.01.2011