2013-06-11 82 views
1

在我的网页当前的URL我使用此代码与一些CSS添加哈希标签来使用JQuery

<ul class="subnav" id="subnav"> 
    <li class="active"><a href="#subover">Overview</a></li> 
    <li><a href="#subnews">News</a></li> 
    <li><a href="#subgallery">Gallery</a></li> 
    </ul> 

里面的新闻选项卡以来,我用.load 3个选项卡设置从页面弧填充.php和id =新闻。

<div class="subcont" id="subnews"> 
    <script> 
jQuery(document).ready(function ($) { 
$('#subnews').append($('<div>').load('arc.php #news')); 
}); 
</script> 
    </div> 

在arc.php页面上,我有新闻描述与指向文章的链接。点击文章链接时。我希望它加载到subnews div中。我正在这样做。

<script> 

jQuery(document).ready(function ($) { 

$("#subnews").on("click", "a", function (e) { 
    $("#subnews").load($(this).attr("href")); 
    e.preventDefault(); 
}); 
}); 
</script> 

现在我的问题......

当新闻文章被加载,网址没有改变,所以我不能使用回回到新闻文章列表。

我确实有代码跟踪哈希标记,它在我从概览,新闻和图库更改时起作用。我可以用回去浏览标签。

有没有一种方法可以在点击文章时为网址添加散列标签以便使用跟踪并能够点击回来?

回答

4

我建议:

$("#subnews").on("click", "a", function (e) { 
    var href = $(this).attr('href'); 
    $("#subnews").load(href); 
    window.location.hash = href; 
    e.preventDefault(); 
}); 

,但我看不出有任何理由使用$(this).attr('href'),并会亲自使用,而不是:

$("#subnews").on("click", "a", function (e) { 
    var href = this.href; 
    $("#subnews").load(href); 
    window.location.hash = href; 
    e.preventDefault(); 
}); 

参考文献:

+0

这很适合添加散列。后退按钮仍然无法正常工作。我猜这是因为div内容被清空并被替换,并且没有什么可以回到。有没有解决这个问题的方法?或另一种方式去解决这个问题? –