jquery - 現在のページを表示中に 2 ページ目をプリロードする

Question

私のウェブサイトに 5 ページのコンテンツがあるとします。訪問者が最初のページを表示している間に、次の 2 ページをプリロードすることは可能ですか? 2 ページ目または 3 ページ目へのリンクをクリックすると、すぐに表示されるようにします。

Answer 1

確かに、次のような目に見えないコンテナをいくつか持つことができます。

HTML

<div id="page">
  <a href="page2.html" id="page2-link">Go second page</a>
</div>
<div id="page2">
</div>

CSS

#page2 { display:none }

Javascript

次に、javascript で、ロードされた後の 2 番目のページをプリロードし、非表示のコンテナに配置します。

$().ready(function(){
  $('#page2').load('page2.html #page');
});

そして、リンクをクリックすると、選択したページで非表示のコンテナを表示して他のコンテナを削除するか、ユーザーが戻りたいときに再度ロードしないように非表示にします。

$().ready(function(){
  $('#page2-link').on('click',function(){
       $('#page').html( $('#page').html() ); //this will replace html content
  });
});