URL中的ID不隱藏其他div

所以我建立一個腳本，它會根據URL中的哪個ID來隱藏div。這是我到目前爲止：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，它仍然顯示它們全部。有任何想法嗎？

來源

2012-07-17 nickdoesdesign

這就是所謂的「哈希」，而不是「ID」。它位於document.location.hash，而不是document.location.href。

if (document.location.hash === '#aberdeen') { 
    $("#centralia, #chewelah, #everett, #harbour-pointe").hide(); 
}

來源

2012-07-17 19:14:16

+1你應該考慮使用switch/case語句... – 2012-07-17 19:15:06

@JosephSilber：是的，大概。或者使用jQuery的'.not'將它全部合併成一行。 – 2012-07-17 19:15:38

謝謝！現在我明白了。 – nickdoesdesign 2012-07-17 20:40:07

嘗試：

if (document.location.hash.indexOf('#aberdeen') != -1) { 
    $("#centralia, #chewelah, #everett, #harbour-pointe").hide(); 
}

來源

2012-07-17 19:13:53 Jordizle

試試這個，你可以添加一個類的項目和使用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-17 19:14:20 undefined

+1使他如果塊成一行。 – 2012-07-17 19:22:20

@火箭感謝:) – undefined 2012-07-17 19:24:45

作爲替代上面給出的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-17 19:25:29 mynameiscoffey

URL中的ID不隱藏其他div

回答

相關問題