tab 이동에 대해
- 작성자 :
- 현*규
- 작성일 :
- 2014-12-22 17:32:13
- 조회수 :
- 909
- 구분 :
- 운영환경
- 진행상태 :
- 완료
Q
안녕하세요.. 제가 지금 모바일 작업을 하고 있는데
처음 jsp에서 두번쨰 jsp로 tab이동을 하려고 하는데요..
처음에는 이미지 버튼이 있고 이미지 버튼을 클릭하면
원하는 tab 페이지로 이동 하려고 하는데 계속 찾고 하는데도 잘 몰라서 물어봅니다..
메인페이지에서
<ul class="ex_box">
<li class="sky_blue">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab1">
<dt>
<img src="<c:url value="/images/ex_1.png" />" alt="시험검증 안내 아이콘" />
</dt>
<dd>시험검증 안내 </dd>
</a>
</dl>
</li>
<li class="sky_blue2">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab2">
<dt>
<img src="<c:url value="/images/ex_2.png" />" alt="시험절차 보기 아이콘" />
</dt>
<dd>시험검증 절차</dd>
</a>
</dl>
</li>
<li class="blue">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab3">
<dt>
<img src="<c:url value="/images/ex_3.png" />" alt="시험진행상황 보기 아이콘" />
</dt>
<dd>시험진행상황 </dd>
</a>
</dl>
</li>
</ul>
이렇게 되있고
tab 있는 jsp페이지에는
<article class="sub_box">
<div class="tab_container">
<ul class="tabs">
<li class="active" rel="tab1">안내</li>
<li rel="tab2">절차</li>
<li rel="tab3">진행상황</li>
</ul>
</div>
<div id="tab1" class="tab_content" style="display:block;" >
</div>
<div id="tab2" class="tab_content" style="display:none;" >
</div>
<div id="tab3" class="tab_content" style="display:none;" >
</div>
</article>
이렇게 되있습니다
어떻게 해야 원하는 tab으로 이동이 가능 할까요
부탁브립니다..
처음 jsp에서 두번쨰 jsp로 tab이동을 하려고 하는데요..
처음에는 이미지 버튼이 있고 이미지 버튼을 클릭하면
원하는 tab 페이지로 이동 하려고 하는데 계속 찾고 하는데도 잘 몰라서 물어봅니다..
메인페이지에서
<ul class="ex_box">
<li class="sky_blue">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab1">
<dt>
<img src="<c:url value="/images/ex_1.png" />" alt="시험검증 안내 아이콘" />
</dt>
<dd>시험검증 안내 </dd>
</a>
</dl>
</li>
<li class="sky_blue2">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab2">
<dt>
<img src="<c:url value="/images/ex_2.png" />" alt="시험절차 보기 아이콘" />
</dt>
<dd>시험검증 절차</dd>
</a>
</dl>
</li>
<li class="blue">
<dl>
<a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab3">
<dt>
<img src="<c:url value="/images/ex_3.png" />" alt="시험진행상황 보기 아이콘" />
</dt>
<dd>시험진행상황 </dd>
</a>
</dl>
</li>
</ul>
이렇게 되있고
tab 있는 jsp페이지에는
<article class="sub_box">
<div class="tab_container">
<ul class="tabs">
<li class="active" rel="tab1">안내</li>
<li rel="tab2">절차</li>
<li rel="tab3">진행상황</li>
</ul>
</div>
<div id="tab1" class="tab_content" style="display:block;" >
</div>
<div id="tab2" class="tab_content" style="display:none;" >
</div>
<div id="tab3" class="tab_content" style="display:none;" >
</div>
</article>
이렇게 되있습니다
어떻게 해야 원하는 tab으로 이동이 가능 할까요
부탁브립니다..
A
안녕하세요. 현창규님.
우선 질문주신 내용은 전자정부 표준프레임워크 기능에서는 제공해 드리고 있지 않으며,
별도로 구현하셔서 적용 하셔야 하는 내용인것 같습니다.
다만, 메인 페이지 코드를 보면 <a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab1">
방식으로 서버에 있는 특정 URL에 파라미터 방식으로 tab 값을 넘기게 되면,
해당 URL이 요청하는 페이지(jsp 또는 page)에 파라미터가 넘어간 후,
JavaScript 처리등을 통해 해당 값(tab1, tab2 등의 tab 변수의 입력값)에 따른 page 또는 div 영역을 화면에 출력 하도록 추가 구현을 하셔야 될 것 같습니다.
그럼 오늘도 좋은하루 보내시기 바랍니다.
감사합니다.
우선 질문주신 내용은 전자정부 표준프레임워크 기능에서는 제공해 드리고 있지 않으며,
별도로 구현하셔서 적용 하셔야 하는 내용인것 같습니다.
다만, 메인 페이지 코드를 보면 <a href="${pageContext.request.contextPath}/examVerify/sub02_01.do?tab=tab1">
방식으로 서버에 있는 특정 URL에 파라미터 방식으로 tab 값을 넘기게 되면,
해당 URL이 요청하는 페이지(jsp 또는 page)에 파라미터가 넘어간 후,
JavaScript 처리등을 통해 해당 값(tab1, tab2 등의 tab 변수의 입력값)에 따른 page 또는 div 영역을 화면에 출력 하도록 추가 구현을 하셔야 될 것 같습니다.
그럼 오늘도 좋은하루 보내시기 바랍니다.
감사합니다.