少し前に似たような質問があり、私は次の解決策を思いつきました。
jsが無効なユーザーが使用できるようにするには、URLが実際のページを指している必要があります。クリックハンドラーはajaxリクエストを処理する必要があります。ハッシュには、URLと&ajax
、リクエストのタイプを示すような部分が含まれている必要があります。
リクエストがajaxからのものである場合は、コンテンツを送信するだけです。そうでない場合は、コンテンツをヘッダーとフッターにラップして、完全なサイトで応答します。
URLは、ajaxで生成されたハッシュにリンクし、それらをリンクとして使用する必要があります。全体的なアイデアは、基本的にFacebookで見られるような動作を模倣しています。
Javascript
// click handler for ajax links
function goToWithAjax(hash) {
hash = hash.href ? hash.getAttribute("href", 2) : hash;
ajax( hash, function( response ) {
document.getElementById("content").innerHTML = response;
});
hash = ("#!/" + hash).replace("//","/");
window.location.hash = hash;
return false;
}
.htaccess
auto_prepend_file = "prepend.php"
auto_append_file = "append.php"
付加する
$url = $_SERVER['REQUEST_URI'];
$parts = explode('#!', $url);
$hash = isset($parts[1]) ? $parts[1] : false;
// redirect if there is a hash part
if ($hash) {
header("Location: $hash");
}
// find out if it's an ajax request
$ajax = strstr($url, "&ajax");
// we need header if it's not ajax
if (!$ajax) {
get_header();
}
追加
// we need footer if it's not ajax
if (!$ajax) {
get_footer();
}
get_header()
function get_header() {
echo <<< END
<html>
<head></head>
<body>
<div id="page">
<div id="header">
<div id="logo"></div>
<ul id="nav">menu...</ul>
</div>
<div id="content">
END;
}
get_footer()
function get_footer() {
echo <<< END
</div> <!-- end of #content --->
<div id="footer">(c) me</footer>
</div> <!-- end of #page --->
</body>
</html>
END;
}