중첩 드롭 다운 선택에 따라 div를 표시/숨기기위한 스크립트 수정

Question

사용자가 드롭 다운에서 학년을 선택하는 드롭 다운 설정을 한 다음 선택한 항목에 따라 div로 조각을 표시합니다 정보를 제공하고 다른 하나는 자신의 직책을 선택합니다. 선택한 위치에 따라 해당 위치에 대한 서명 보너스가있는 div가 표시됩니다.

모두 괜찮습니다.하지만 내가 원하는 것은 사용자가 다른 학년을 선택했을 때, 현재 선택한 학년도 동안 열려있는 div를 숨기고 새로운 것을 표시하고자 할 때입니다. 따라서 고등학교를 선택하고 Junior College를 선택한 경우 고등학교 졸업장을 닫고 Junior college div를 열어 보겠습니다. 위치가 선택 될 때와 마찬가지로, 처음으로 Center를 선택한 다음 Shortstop을 선택하면, hs-center div를 숨기고 hs-shortstop div를 표시합니다. 그 말이 맞는다면.

스크립트 :

<script type="text/javascript"><!-- 
var lastDiv = ""; 
function showDiv(divName) { 
//if value of the box is not nothing and an object with that name exists, then change  the class 
if (divName && document.getElementById(divName)) { 
    document.getElementById(divName).className = "visibleDiv"; 
    lastDiv = divName; 
} 
} 
//--> 
</script> 

CSS : .hiddenDiv { 디스플레이 : (여기에 또 다른 질문의 호의!) 없음; } .visibleDiv { display : 블록; }

관련 HTML :http://pastebin.com/PULvhY8d

내가 div의 숨어 있지만 내가 어떻게 중첩 갖는 문제의 원인이 된, 그것은이 있었다 원래 사용하고 스크립트. 그래서 좀 더 구체적인 대안이 필요합니다. 어떻게해야할지 모르겠습니다. 이 같은 것들에 대한 지식은 최소한이기 때문에 더 잘 이해할 수 있도록 더 많이 멍청 할 수 있습니다!

{ 
// hide last div 
if (lastDiv) { 
    document.getElementById(lastDiv).className = "hiddenDiv"; 
} 

나는 더 많은 드롭 다운이 예에서 무엇보다 정보를하지만, 난 그냥 일을 추가로 더 진행하기 전에이 정리 얻고 싶었다.

나에게 필요한 것이 있으면 알려주고 도움을 주셔서 감사합니다.

Answer 1

가능한 경우 jQuery를 사용하는 것이 좋습니다. jQuery는 사용하기가 매우 쉽고 매일 사용하기가 더 쉽습니다 :) jQuery가 기본 페이지에 스크립트 태그를 추가하여 응용 프로그램에서 작업해야합니다. jQuery가 옵션 인 경우 여기에서 시나리오에 대한 작업 예제를 살펴보십시오. http://jsfiddle.net/snitin_78/HtHjs/. jQuery를 사용하면 코드의 어디에서나 showDiv() 함수에 대한 호출을 제거 할 수 있습니다.