JS / 在Blogger建立分頁

Blogger沒有辦法用增加<!--nextpage-->的方式在文章內設定分頁

不過從股狗大神獲得的指示：可以在文章內執行Javascript程式來控制指定區塊的顯示或隱藏

原理是透過綁定click事件，來顯示指定的區塊

---

第一頁的內容

第二頁的內容

第三頁的內容

第四頁的內容

Pages: 1 2 3 4

---

程式碼  

<div class="content0"></div>
<div class="content1">
 
<!--第一頁的內容-->
第一頁的內容
</div>
<div class="content2" style="display: none;">
 
<!--第二頁的內容-->
第二頁的內容
</div>
<div class="content3" style="display: none;">
 
<!--第三頁的內容--> 
第三頁的內容
</div>
<div class="content4" style="display: none;">
 
<!--第四頁的內容-->
第四頁的內容
</div>
<p>
	<b>Pages: <span style="color: #3d85c6;">
			<a class="page1" href="#">1</a>
			<a class="page2" href="#">2</a>
			<a class="page3" href="#">3</a>
			<a class="page4" href="#">4</a>
		</span>
	</b>
</p>
 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
jQuery(document).ready(function(){	   
	jQuery('.page1').click(function(){
		 jQuery('html,body').animate({ scrollTop: jQuery('.content0').offset().top }, 600);
		jQuery('.content1').show();
		jQuery('.content2').hide();
		jQuery('.content3').hide();
		jQuery('.content4').hide();
 
		return false;
	});
 
	jQuery('.page2').click(function(){
		jQuery('html,body').animate({ scrollTop: jQuery('.content0').offset().top }, 600);
		jQuery('.content1').hide();
		jQuery('.content2').show();
		jQuery('.content3').hide();
		jQuery('.content4').hide();
 
		return false;
	});
 
	jQuery('.page3').click(function(){
		jQuery('html,body').animate({ scrollTop: jQuery('.content0').offset().top }, 600);
		jQuery('.content1').hide();
		jQuery('.content2').hide();
		jQuery('.content3').show();
		jQuery('.content4').hide();
 
		return false;
	});
 
	jQuery('.page4').click(function(){
		jQuery('html,body').animate({ scrollTop:jQuery('.content0').offset().top }, 600);
		jQuery('.content1').hide();
		jQuery('.content2').hide();
		jQuery('.content3').hide();
		jQuery('.content4').show();
 
		return false;
	});
});
</script>