1

所以我构建了一个脚本,它将根据 url 中的 ID 隐藏 div。这是我到目前为止所拥有的:

<script>
$(function(){ 
if (document.location.href.indexOf('#aberdeen') > 0) 
$("#centralia, #chewelah, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#centralia') > 0) 
$("#aberdeen, #chewelah, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#chewelah') > 0) 
$("#aberdeen, #centralia, #everett, #harbour-pointe").hide();

if (document.location.href.indexOf('#everett') > 0) 
$("#aberdeen, #chewelah, #centralia, #harbour-pointe").hide();

if (document.location.href.indexOf('#harbour-pointe') > 0) 
$("#aberdeen, #chewelah, #everett, #centralia").hide();

if (document.location.href.indexOf('#') < 0)
    $(".directory").show();
});
</script>

但是,即使在 URL 中附加了一个 id,它仍然会显示所有这些。有任何想法吗?

4

4 回答 4

7

这称为“哈希”,而不是“ID”。它位于document.location.hash,而不是document.location.href

if (document.location.hash === '#aberdeen') {
    $("#centralia, #chewelah, #everett, #harbour-pointe").hide();
}
于 2012-07-17T19:14:16.530 回答
2

试试这个,你可以为项目添加一个类并使用document.location.hash

$(function(){ 
   var id = document.location.hash;
   $('.all').not(id).hide() // hide them expect the element that has an id of hash
});
于 2012-07-17T19:14:20.590 回答
0

尝试 :

if (document.location.hash.indexOf('#aberdeen') != -1) {
    $("#centralia, #chewelah, #everett, #harbour-pointe").hide();
}
于 2012-07-17T19:13:53.810 回答
0

作为上面给出的 Javascript 解决方案的替代方案,您可以在 CSS 中执行此操作(仅限现代浏览器):

如果你给所有的 div 例如一个hashdisplay类,你可以有以下样式:

.hashdisplay { display: none; }
.hashdisplay:target { display: block; }

http://jsfiddle.net/9qCYU/

警告!!仅适用于支持:target伪类的浏览器!

http://reference.sitepoint.com/css/pseudoclass-target

于 2012-07-17T19:25:29.243 回答