2017-05-15 13 views
0

私はこのことについてたくさん読んでおり、すべての部分を理解している間に、私のプロジェクトをやり直すことなくすべてをまとめていく方法を理解できないと感じています。私はajaxを設定し、私のサイトで本当にうまく動作しています。新しいコンテンツが入ったときにURLに#を追加することができました。戻るボタンが機能し、ページをリロードすることなくすべての正しいURLを調べますが、ajaxは更新されません。ここJquery AjaxはHTML5の履歴と戻るボタンを呼び出します

<a class="portfolioThumbnail" onclick="return false;" data-name="myPage" href="myPage.html"> 

    <img src="imagepath" /> 

</a> <!-- portfolioThumbnail --> 

と私のjQueryのです:私はあまりにも私のHTMLにprojectWrapperReplaceと呼ばれるdiv要素を持っている

$('.portfolioThumbnail').on('click', function(){ 

var thisProject = $(this).attr('href') 

$.ajax('http://oursite.com/' + thisProject, { 
    success: function(response) { 
    $('.projectWrapperReplace').html(response); 
    }, 
    error: function() { 

     alert('error'); 
    }, 
    timeout: 5500, 
    beforeSend: function() { 

    $(this).find('.portfolioThumbnail').addClass('loading'); 

    }, 
    complete: function() { 


    $(".blurable").addClass('blur'); 

    $(".blurable").addClass('whiteOut'); 



    $('.projectWrapper').fadeIn('slow', function(){ 

     $('.projectWrapper').addClass('noBlur'); 

     window.location.hash = thisProject; 


    }); 

    } 

}); 

});  

これは、ボタンのための私のHTMLです。誰でも私がこの仕事を手助けできるかどうかを見てください。ありがとう

答えて

1

戻るボタンまたは進むボタンが押されたときにイベントリスナーが必要です(今は、.portfolioThumbnailボタンをクリックしたときにのみajaxコンテンツを読み込みます)。

Ajaxの負荷および状態のクラス別の関数を作成し、hashChange()

アウトonhashchange

//call hashChange on window hash chage 
window.onhashchange = hashChange; 
//and also on buttonclick 
$('.portfolioThumbnail').on('click', function() { 
    hashChange(); 
}) 
を言います
関連する問題