ajaxはアンカーリンクでコンテンツをロードしますか？ライブハンドラ？

Question

こんにちは、 私はサブサイトからdivをajaxでロードしています。このサブサイトは、このようなことでリンクを持っている：AJAXリクエストが発射される

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

私のホームページは、この#someIDonHomepage div要素を持っていると私は私のページには、その位置にジャンプします。

しかし、私はアンカーを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'); 
      })  
     }); 
    }); 

私はそれを解決することができる方法任意のアイデア？ありがとう

Answer 1

jQueryのAjaxyはハッシュでAJAXを使用するためのサポートが組み込まれ、だけでなく、伝統的なアンカーのための後方支援している - デモにドリアン]タブをクリックします。

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

Answer 2

LearningJqueryアプローチを使用することも、そのプラグインを直接使用することもできます。彼らのアプローチの
Example。

$(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 []; 
    } 
});