0

我一直在使用以下帖子的最佳答案中的代码:

需要帮助了解如何对网站进行 ajaxify

当我尝试使用 .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>

但这会阻止页面加载完全工作。任何建议将不胜感激。谢谢!

4

0 回答 0