Skip to content

Instantly share code, notes, and snippets.

@yoozoosato
Created March 8, 2013 07:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save yoozoosato/5114712 to your computer and use it in GitHub Desktop.
Save yoozoosato/5114712 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>Pjax sample</title>
<%# jquery と pjax を読み込む。順番重要らしい %>
<script type="text/javascript" src="/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="/js/jquery.pjax.js"></script>
<%# 別のjsファイルに書くの面倒だからここに書いただけ %>
<script type="text/javascript">
$(function(){
// a タグで pjax 属性が付いているものは pjax 使う
// 属性指定しないと、全ての a タグが対象になる
$(document).pjax('a[pjax]', '#main');
})
</script>
<style>
.dotborder {
width: 95%;
border-width: 3px;
border-style: dotted;
margin-left: 10px;
margin-right: 10px;
margin-top: 10px;
}
</style>
</head>
<body>
<h2>サンプル</h2>
<div class="dotborder">
<p>ここはさしかわらない</p>
<a href="http://www.gamepot.co.jp/">がめぽとっぷ</a> |
<a href="/">さんぷるとっぷ</a> |
<a href="/test/NDF6iUM_FQA" pjax>かえる</a> |
<a href="/test/eb1c-T-ox-E" pjax>こうかく</a>
</div>
<div class="dotborder" id="main">
<%= yield %>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment