jQuery：如何隐藏网址中带锚点的部分

Question

在我的页面上，h3标题下的大多数p-部分都是隐藏的。如果你点击它们，会显示下面的内容。页面打开时仅显示第一部分。我使用jQuery来隐藏这些部分，如：

jQuery("#area h3:first").addClass("active"); 
jQuery("#area p:not(:first)").hide(); 

但是，如果在其他部分的一个锚，并且用户在URL的末尾链接到它与＃？现在，它跳转到隐藏部分，这是令人烦恼的，因为文本没有显示。当网址中的锚点位于此部分内时，我不想隐藏该部分，例如http://domain.com/page.php#anchor_in_section_3。

如何防止该部分隐藏/折叠？

详细信息： 答案1之后，我发现两个问题：如果以后使用.hide和.show只需一行代码，则这些部分将保持隐藏状态。这对jQuery来说似乎很快。 另一个问题是，使用解答1中描述的解决方案，jQuery只发现锚点，如果它不在子标记中。

更困难比我想象:)

所以的话描述的解决方案是，除第一和含有锚标记上的一个章节都应该被隐藏。锚可以在该部分的任何（孩子）标签中。

尝试了2个小时将此转换为jQuery，但没有成功，我的可怜的jQuery知识。

Answer 1

要想从URL中的锚的名称，请使用以下行：

var anchorName = document.location.hash.substring(1) 

检索的URL的哈希部分，然后修剪的第一个字符出来（第一个字符永远是哈希符号，“＃”）。这里有一些文件：Javascript Tutorial, Location.hash。一旦你的，这样做如下：

jQuery("#area p:has(a[name=" + anchorName + "])").show(); 

这将显示在#area包含在URL中的散列部分指定的名称锚任何段落。

编辑

要解决的jQuery是快速的问题，你可以使用一个发烧友的选择，只隐藏最终会隐藏，像这样的：

$("#area > p:not(:first)").filter("p:not(:has(a[name=" + anchorName + "]))").hide(); 

，说除第一个段落以外的所有段落，然后将那些不包含具有给定值的锚点的子集作为name属性，并隐藏剩余的部分。第一段以及任何包含指定名称的锚都将保持可见。

这里有一个现场演示：http://jsfiddle.net/JDQxP/

因为我们无法从上的jsfiddle的URL散列，我已经取代静态值该行。一次取消一个注释，以查看每个效果。请注意，“phasellus”锚点位于包装范围内，但选择器仍能正常工作。