Я думаю, что скрипт, который вы ищете, это pjax , он имеет именно все функции, которые вы хотите. Вы можете найти его на github: https://github.com/defunkt/jquery-pjax/tree/heroku
EDIT
Вы можете использовать его с любым языком на стороне сервера. Например,
<script src="jquery.js"></script>
<script src="jquery.cookie.js"></script>
<script src="jquery.pjax.js"></script>
<script type="text/javascript">
$(function(){
$('nav a').pjax('#content')
})
</script>
в голове вашего сайта,
<nav>
<a href="otherContent1.php" >click me for other content</a>
<a href="otherContent2.php" >click me for even more additional content</a>
</nav>
<section id="content">
<h1>Original Content</h2>
<p>
this will be replaced by pjax with the content's of <a href="otherContent1.php">otherContent1.php</a> or <a href="otherContent2.php">otherContent2.php</a>
</p>
</section>
в вашем основном шаблоне и измените ваш php-код так, чтобы он искал заголовок HTTP_X_PJAX. Если он присутствует (см. xhr.setRequestHeader('X-PJAX', 'true')), визуализируйте только ту часть, которая должна заменить содержимое <section id="content">, иначе - всю страницу. Тогда Pjax достаточно умен, чтобы, если он работает, он заменял только содержимое <section id="content">, а если он не работал, у вас все еще были бы обычные ссылки. pjax даже позаботится о Google Analytics, если вы используете его, поэтому ваше отслеживание все еще работает.
EDIT2: пример
Хорошо, вот вам примерная страница php. Имейте в виду, что я не проверил это, я просто быстро и грязно написал здесь о переполнении стека, чтобы показать, как вы могли бы решить эту проблему. Этот код не проверен и, конечно, не готов к производству . Но в качестве примера вы можете сделать что-то вроде этого (файл должен называться index.php):
<?php
$render_template=true;
if ($_SERVER["HTTP_X_PJAX"])
{
$render_template=false;
}
?>
<?php
if ($render_template) {
?>
<html>
<head>
<meta charset="utf-8" />
<title>Testing Pjax</title>
<script src="jquery.js"></script>
<script src="jquery.cookie.js"></script>
<script src="jquery.pjax.js"></script>
<script type="text/javascript">
$(function(){
$('nav a').pjax('#content')
})
</script>
</head>
<body>
Date in template: <?php echo $today = date("D M j G:i:s T Y"); ?>
<nav>
<a href="index.php?content=1" >click me for other content</a>
<a href="index.php?content=2" >click me for even more additional content</a>
</nav>
<section id="content">
<?php
}
?>
<?php
if ($_Get["content"]==1)
{
?>
<h1>Content=1</h1>
Date in content: <?php echo $today = date("D M j G:i:s T Y"); ?>
<p>
this will be replaced by pjax with the content's of <a href="index.php?content=1">index.php?content=1</a> or <a href="index.php?content=2">index.php?content=2</a>
</p>
<?php
} else {
?>
<h1>Content 2=2</h1>
Date in content: <?php echo $today = date("D M j G:i:s T Y"); ?>
<p>
this will be replaced by pjax with the content's of <a href="index.php?content=1">index.php?content=1</a> or <a href="index.php?content=2">index.php?content=2</a>
</p>
<?php
}
?>
<?php
if ($render_template) {
?>
</section>
</body>
</html>
<?php
}
?>