javascript - JS-在 onclick() 事件中链接到文档内的 anchor

Question

我对以下代码有疑问，假设其余代码没问题(html、head、body 等) 我想要做的是，当您单击其中一个按钮时，该部分中隐藏的文本/图像会显示或隐藏，代码就可以正常工作。问题是我还希望它在您单击按钮时将您带到新出现的部分中的 anchor ，但我似乎无法做到这一点。

这是 HTML 上的代码

<h2 class="especial">TITLE</h2> 
<p class="normal"><input type=image src="images/img_beta/buttonimage1.png" onclick="show_section1();">Section1</p>
<p class="normal"><input type=image src="images/img_beta/buttonimage2.png" onclick="show_section2();">Section2</p>  
<hr>
<div id="Section1" style="display:none">
<a id="Section1_anchor"><h2 class="especial">Sect1TittleHere</h2></a>
    <p class="interior">Blablah this is the content of section1</p> 

</div>
<div id="Section2" style="display:none"> 
<a id="Section2_anchor"><h2 class="especial">Sect2TittleHere</h2></a>
    <p class="interior">Blablah content of section2</p>
    </div>

这里是控制onclick事件的JS函数，我每个部分都有一个，但它们都是一样的。

<script language='javascript'>
//Variables
var sect1_guardian=0, sect2_guardian=0, sect3_guardian=0;       
function show_sect1(){
    if (sect1_guardian == 0) {          document.getElementById("Section1").style.display="block";
        sect1_guardian=1;
        //Close the other sections if opened
        document.getElementById("Section2").style.display="none";
        document.getElementById("Section3").style.display="none";
        //Reset guardians
        sect2_guardian=0;
        sect3_guardian=0;           
    }
    else {
        document.getElementById("Section1").style.display="none";
        sect1_guardian=0;
    }
}   

我应该在哪里以及如何将链接添加到 anchor ？如果我尝试将它添加到按钮标签和 onclick 事件。我做这样的事情

<p class="normal"><a href="#Section1_anchor"><input type=image src="images/img_beta/buttonimage1.png" onclick="show_section1();"></a>Section1</p>

因为 onclick 事件在图像中，我不希望文本被超链接。显然我失去了一些东西/做错了什么，可能是一个羞辱性的错误，但我请求建议和更正。

Answer 1

如果它完全是您代码的复制粘贴，则单击处理程序称为“show_section1()”，函数称为“show_sect1()”。注意 sect != section :) 。

我们应该看得更远吗？