Question

我有一个页面使用下面的代码来展开和折叠文本段落。现在，我需要设置锚标记以便链接，例如www.website.com/page#section1，将自动扩展文本。

似乎我可以将location.hash添加到当前函数中，但我不确定如何去做。

提前致谢！

<a name="section1"><h3><span id="toggleControlS2" onClick="toggleS2();">Section 1</span></h3></a>

<p id="hiddenTextBlockS2">Paragraph of text</p>

Javascript：

<script type="text/javascript">
var toggleControlS2=document.getElementById("toggleControlS2");
var hiddenTextBlockS2=document.getElementById("hiddenTextBlockS2");

function toggleS2()
{
    if(hiddenTextBlockS2.style.display=="block")
    {
        hiddenTextBlockS2.style.display="none";
        toggleControlS2.innerHTML="Section 1 +";
    }
    else if(hiddenTextBlockS2.style.display=="none")
    {
        hiddenTextBlockS2.style.display="block";
        toggleControlS2.innerHTML="Section 1 -";
    }
}

hiddenTextBlockS2.style.display="none";
toggleControlS2.style.cursor="pointer";
</script>

Answer 1

将其添加到

下面

这里发生的是，一旦页面加载，我们检查位置哈希以查看它是否匹配＆＃34; #section1＆＃34;。如果是这样，我们执行与单击#toggleControlS2范围相同的逻辑。

e.g

<script type="text/javascript">
var toggleControlS2=document.getElementById("toggleControlS2");
var hiddenTextBlockS2=document.getElementById("hiddenTextBlockS2");

function toggleS2()
{
    if(hiddenTextBlockS2.style.display=="block")
    {
        hiddenTextBlockS2.style.display="none";
        toggleControlS2.innerHTML="Accepted (peer-reviewed) Version +";
    }
    else if(hiddenTextBlockS2.style.display=="none")
    {
        hiddenTextBlockS2.style.display="block";
        toggleControlS2.innerHTML="Accepted (peer-reviewed) Version -";
    }
}

hiddenTextBlockS2.style.display="none";
toggleControlS2.style.cursor="pointer";

if(location.hash === "#section1"){
  toggleS2();
}
</script>

如何使用javascript在URL中使用锚标记展开折叠文本？

1 个答案: