Javascript 当URL上有哈希时，如何打开隐藏的div？

我正在使用此javascript代码在我的站点上设置几个“显示/隐藏”切换div：

<script language="javascript"> 
function toggledean() {
    var ele = document.getElementById("toggleTextdean");
    var text = document.getElementById("displayTextdean");

    if(ele.style.display == "block") {
        ele.style.display = "none";
        text.innerHTML = "Show more";
    } 
    else {
        ele.style.display = "block";
        text.innerHTML = "Hide";
    }
} 
</script>

函数toggledean（）{
var ele=document.getElementById（“toggleTextdean”）；
var text=document.getElementById（“displayTextdean”）；
如果（ele.style.display==“块”）{
ele.style.display=“无”；
text.innerHTML=“显示更多”；
} 
否则{
ele.style.display=“块”；
text.innerHTML=“隐藏”；
}
} 

我应该向这段代码添加什么，以便在加载带有添加到URL的特定散列的页面时显示div

---

非常感谢。

这不是您想要的javascript答案，但您可以尝试使用

：target

伪选择器。比如说,

<!-- HTML -->
<div id="foo">show this with #foo.</div>
<div id="bar">#bar shows this.</div>

<style type="text/css">
    div {display: none}
    :target {display: block}
</style>

像这样的方法应该会奏效：

var hash=window.location.hash.replace（'#'，''）；
if（散列）{
document.getElementById（散列）.style.display='block'
}

如果您只有一个元素，就像您的脚本一样，如果url中存在任何哈希，您可以调用函数来切换它：

<script type="text/javascript"> 
   function toggledean() {
    ...
    } 
    if (window.location.hash == '#dean') toggledean(); 
</script>

函数toggledean（）{
...
} 
如果（window.location.hash='#dean'）切换到dean（）；

或者，您可以使切换脚本更通用一些：

<script type="text/javascript"> 

var hash = window.location.hash.replace('#', '');   

function toggle (elementPartial) {

    var ele = document.getElementById('toggleText'+elementPartial);
    var text = document.getElementById('displayText'+elementPartial);
    if(ele.style.display == 'block') {
        ele.style.display = 'none';
        text.innerHTML = 'Show more';
    } else {
        ele.style.display = 'block';
        text.innerHTML = 'Hide';
    }
} 

if (hash) {
    toggle(hash); 
}

</script>

var hash=window.location.hash.replace（'#'，''）；
功能切换（elementPartial）{
var ele=document.getElementById（'toggleText'+elementPartial）；
var text=document.getElementById（'displayText'+elementPartial）；
如果（ele.style.display=='block'）{
ele.style.display='none'；
text.innerHTML='显示更多'；
}否则{
ele.style.display='block'；
text.innerHTML='Hide'；
}
} 
if（散列）{
切换（散列）；
}

---

此外，您可以使用javascript框架（如jQuery）使其变得更简单、更灵活

其他人已经回答了URL哈希部分，我只对脚本进行评论：

> <script language="javascript">  

考虑到第一次加载div时显示值为“”的可能性非常高，您最好测试

style.display='none'

，因此：

if (ele.style.display == 'none') {
    ele.style.display = '';
    text.innerHTML = 'Hide';

} else {
    ele.style.display = 'none';
    text.innerHTML = 'Show more';
}

---

翻译：请帮我做，如果你是对的，我保证它会起作用。@jared对不起，我不是故意让它变成那样的。我已经研究了几个小时，但运气不好，而且我对JavaScript非常陌生，所以我想我应该在这里发布一些帮助。我不认为这太可怕。如果您不反对jQuery，请参阅。@mikeycgo，这是一个很好的观点。IE中不支持此功能，这是使用此功能的一个问题。；）@Jared Farrish愚蠢的我！天才添加锚标签。。。我将添加这两个选项，编辑我的答案，并为您评分。谢谢JavaScript总是可以覆盖

：target

规则。我想他以后还需要使用这个函数来切换div。。。（我认为两者可以同时使用）现实是，这可能没那么容易；如果OP需要跨浏览器，CSS2（ish）回答怎么办？然后呢？我补充说，这根本不应该被使用，这只是一个小小的想法。IE不支持的事实是：target本身就是一个交易破坏者，但作为记录，：target的支持列表：Firefox（1.0+）、Safari（3.1+）、Opera（9.5+）、Chrome[.location.hash包含实际的散列字符，因此此解决方案（使用getElementById（…））除非预先加上哈希字符，否则很可能无法工作。伙计，这是在挖掘过去的@schlimmchen…我甚至不记得写过这些。根据这些信息做了一些修改。我不想打扰你，@hellodaniel。我发现这个问题，尽管它的年龄和你的答案在我自己的javascript探索中有所帮助，但我只是我意识到它有这个缺陷…谢谢你修改它！我可以使用：```var hash=window.location.hash.replace（'#'，''）；if（hash）{document.getElementById（hash.classList.add）（“bio open”）；}``但是这个页面上的其他函数不再工作，所以我无法关闭这个脚本打开的窗口

> <script language="javascript">  

<script type="text/javascript">

> function toggledean() {
>     var ele = document.getElementById("toggleTextdean");
>     var text = document.getElementById("displayTextdean");
> 
>     if(ele.style.display == "block") {

>         ele.style.display = "none";
>         text.innerHTML = "Show more";
>     } else {
>         ele.style.display = 'block';
>         text.innerHTML = 'Hide';
>     }

if (ele.style.display == 'none') {
    ele.style.display = '';
    text.innerHTML = 'Hide';

} else {
    ele.style.display = 'none';
    text.innerHTML = 'Show more';
}