1

次のコードに問題があります。残りは問題ないと想像してください (html、head、body など)。ボタンの 1 つをクリックすると、セクションの非表示のテキスト/画像が表示または非表示になります。コードはそれをうまく行います。問題は、ボタンをクリックしたときに、新しく表示されたセクションのアンカーに移動したいのですが、それができないようです。

ここに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 関数は次のとおりです。各セクションに 1 つずつありますが、すべて同じです。

<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;
    }
}

アンカーへのリンクをどこにどのように追加すればよいですか? ボタンタグとonclickイベントに追加してみたら。私はこのようなことをします

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

onclick イベントが画像内にあり、テキストをハイパーリンクしたくないためです。明らかに私は何かを失っています/何か間違ったことをしています.おそらく屈辱的な間違いですが、提案と修正をお願いします.

4

3 に答える 3

0

わかりました、解決策を見つけました。それははるかに簡単で、問題を間違った方法で提示していたため、おそらく誰もそれを言わなかったでしょうが、おそらくこれは誰かを助けるでしょう.

ボタンでドキュメント内のアンカーに移動できるようにしたかったのですよね?

上記のコードはうまく機能し、ボタンをクリックすると、非表示のテキストが表示されたり、非表示になったりしました。

ここで、ボタン コードに次のコードを追加すると、アンカーも実行されます。

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

ボタンをリンクするためのタグを追加し、HTML id (JS で既に使用したもの) を使用してアンカーとして機能させました。わかりやすく説明して、誰かの役に立てば幸いです。

キーは、HTML ID をアンカーとして使用することでした

于 2013-01-04T17:14:59.867 に答える
0

コードをそのままコピーした場合、onclick ハンドラは「show_section1()」と呼ばれ、関数は「show_sect1()」と呼ばれます。セクション != セクション :) に注意してください。

もっと見る必要がありますか？

于 2012-12-17T10:33:35.967 に答える
0

あなたが提案したhtmlを持って、次のようなことをすることができます:

window.location = document.getElementById("Section1").parentNode.href;

「Section1」を特定のセクションに置き換えます。

于 2012-12-17T12:01:04.667 に答える