我一直在使用以下帖子的最佳答案中的代码:
当我尝试使用 .html 页面时,它可以正常工作,如示例所示。但是,我的页面是在 php.ini 中的。一切都在 php 页面上正常工作,除了当 url 更新时它显示为 .html 而不是 .php。
在代码中,取自我提到的答案:
<script type="text/javascript">
var directory = 'content/'; //directory of the content we want to ajax in
var state = History.getState();
//for when they click on an ajax link
$('.ajaxify').on('click', function(e){
var $this = $(this);
var href = $this.attr('href'); // use the href value to determine what content to ajax in
$.ajax({
url: directory + href + '.html', // create the necessary path for our ajax request
dataType: 'html',
success: function(data) {
$('#content').html(data); // place our ajaxed content into our content area
History.pushState(null,href, href + '.html'); // change the url and add our ajax request to our history
}
});
e.preventDefault(); // we don't want the anchor tag to perform its native function
});
//for when they hit the back button
$(window).on('statechange', function(){
state = History.getState(); // find out what we previously ajaxed in
$.ajax({
url: directory + state.title + '.html', //create our path
dataType: 'html',
success: function(data) {
$('#content').html(data);
}
});
});
</script>
我试过改变
$.ajax({
url: directory + href + '.html', // create the necessary path for our ajax request
dataType: 'html',
success: function(data) {
$('#content').html(data); // place our ajaxed content into our content area
History.pushState(null,href, href + '.html'); // change the url and add our ajax request to our history
}
});
到(将 .html 更改为 .php):
$.ajax({
url: directory + href + '.php', // create the necessary path for our ajax request
dataType: 'html',
success: function(data) {
$('#content').html(data); // place our ajaxed content into our content area
History.pushState(null,href, href + '.php'); // change the url and add our ajax request to our history
}
});
但是,这没有效果。我也尝试过更改 HTML:
<ul id="nav">
<li id="home-link"><a href="home" class="ajaxify" title="Home">Home</a></li>
<li id="work-link"><a href="work" class="ajaxify" title="Work">Work</a></li>
<li id="labs-link"><a href="labs" class="ajaxify" title="Labs">Labs</a></li>
<li id="blog-link"><a href="blog" class="ajaxify" title="Blog">Blog</a></li>
</ul>
<div id="content">Home Content</div>
到(将 .php 添加到 hrefs):
<ul id="nav">
<li id="home-link"><a href="home.php" class="ajaxify" title="Home">Home</a></li>
<li id="work-link"><a href="work.php" class="ajaxify" title="Work">Work</a></li>
<li id="labs-link"><a href="labs.php" class="ajaxify" title="Labs">Labs</a></li>
<li id="blog-link"><a href="blog.php" class="ajaxify" title="Blog">Blog</a></li>
</ul>
<div id="content">Home Content</div>
但这会阻止页面加载完全工作。任何建议将不胜感激。谢谢!