클릭시 숨겨진 div 및 hide 버튼 표시

Question

클릭시 숨겨진 div를 여는 자바 스크립트 기능이 있지만 클릭시 버튼을 제거하거나 숨기고 싶습니다. 나는 그것이 가능하다는 것을 안다. 그러나 나는 그것을 이해할 수 없었다.

<span id="first_related"> 
    content 1 
</span> 

<span id="second_related" style="display:none;"> 
    content 2 hidden/display on click 
</span> 

<div class="clear"></div> 
<div class="btn"> 
<input id="current_page_viewed_videos" type="hidden"> 
<input type="hidden" id="related_videos_delta"><a onclick="showDiv()">Show More</a> 
</div> 

<script type="text/javascript"> 
    function showDiv() { 
     document.getElementById('second_related').style.display = "block"; 
     document.getElementById('open').style.display = "none"; 
    } 
</script> 

고마워요!

Answer 1

자바 스크립트가 OK입니다) (숨기기, 당신이 필요로하는 모든 것을 단지 <button id="open" onclick="showDiv()">click</button>를 추가하는 것입니다

function showDiv() { 
 
    document.getElementById('second_related').style.display = "block"; 
 
    document.getElementById('open').style.display = "none"; 
 
}

<span id="first_related"> 
 
content 1 
 
</span> 
 

 
<span id="second_related" style="display:none;"> 
 
content 2 hidden/display on click 
 
</span> 
 

 
<button id="open" onclick="showDiv()">click</button>

업데이트 질문에 대해 :

function showDiv() { 
 
    document.getElementById('second_related').style.display = "block"; 
 
    document.getElementById('open').style.display = "none"; 
 
}

<span id="first_related"> 
 
    content 1 
 
</span> 
 

 
<span id="second_related" style="display:none;"> 
 
    content 2 hidden/display on click 
 
</span> 
 

 
<div class="clear"></div> 
 
<div class="btn"> 
 
<input id="current_page_viewed_videos" type="hidden"> 
 
<input type="hidden" id="related_videos_delta"><a id="open" onclick="showDiv()">Show More</a> 
 
</div>

Answer 2

jquery를 사용하면 간단 할 수 있습니다. 사업부의 추가 보여줍니다 코드에서 다음 (예 : ID = '으로 myButton')를 버튼 을 id를 보내기. $ ('#의를 myButton')를