2012-12-17 2 views
1

다음 코드에 문제가 있습니다. 나머지는 괜찮습니다 (html, head, body 등) 내가 원하는 것은, 섹션 중 숨겨진 텍스트/이미지의 버튼 중 하나를 클릭하여 표시하거나 숨기면 코드가 올바르게 처리됩니다. 문제는 버튼을 클릭 할 때 새로 등장한 섹션의 앵커에게 데려다주고 싶습니다. 그렇게 할 수없는 것 같습니다.JS - onclick() 이벤트의 문서 안쪽에 앵커에 연결

다음은 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; 
    } 
} 

어디에서 어떻게 앵커에 링크를 추가해야합니까? 단추 태그 및 onclick 이벤트에 추가하려고하면. onclick 이벤트는 이미지에 내가 텍스트를 hiperlinked되고 싶지 않기 때문에 나는이

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

그런 짓을. 분명히 뭔가를 잃어 버리고 뭔가 잘못된 일을하고있는 것 같아요. 아마 굴욕적인 실수 일 겁니다. 그러나 나는 제안과 수정을 요구합니다.

답변

0

정확하게 코드 붙여 넣기이면 onclick 처리기는 'show_section1()'이고 함수의 이름은 'show_sect1()'입니다. 통고! = 섹션 :).

더보아야할까요?

+0

더 봐 앵커로 HTML ID를 사용했다 나에게주는 뭐죠 고정되어 문제 : ( – AbianG

0

당신은 당신이 제안 된 HTML을 가지고 같은 것을 수행 할 수 있습니다

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

이 특정 섹션 '조 제 1 항'을 교체합니다.

+0

나는 내 JS 함수에 넣었지만 작동하지 않는다. 방화범이 끌었다 : TypeError : document.getElementById (...). getParent는 함수가 아니다. 나는 아직도 뭔가 잘못하고 있다고 생각한다. _ < – AbianG

+0

죄송합니다, 내 대답을 수정했습니다. parentNode, getParent()가 아닙니다. –

0

좋아요, 해결책을 찾았습니다. 문제를 훨씬 잘못 제시했기 때문에 아무도 말하지 않았지만 아마 누군가에게 도움이 될 것입니다.

단추로 문서의 앵커로 이동하게하고 싶습니다.

위의 코드는 잘 작동하고 버튼을 클릭하면 숨겨진 텍스트가 표시되거나 숨겨집니다.

이제 버튼 코드에 다음을 추가하면 앵커도 처리됩니다.

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

I은 ​​단지 버튼을 링크에 태그를 추가하고, 앵커로서 기능 (I 이미 사용 JS)가 HTML ID를 사용 하였다. 나는 그것을 분명히 설명하기를 희망하고, 그것은 누군가를 돕는다!

키는 그것 아닌 직접 복사/붙여 넣기 (변경 이름과 재료) 및 숨겨진 된 div의 전시가 잘 작동하기 때문에,

관련 문제