묻고답하기

외부에서 각각의 탭에 링크 시킬 수 있는 방법이 있을까요?

즉 a라는 페이지에 탭1/탭2/탭3/탭4 이런 순서로 탭이 구성되어있을때,

메인이나 메뉴에서 특정 버튼을 클릭하면 b페이지의 탭1이 기본으로 보여지다가

링크타서 오면 특정탭이 보여지게 하고 싶습니다.

 

어떤분께서 아래와 같이 답변을 주셨는데,

 

그럼 이렇게 해보세요.
탭으로 링크할때
bpage.html?opentab=b이렇게 하고요

b 페이지 스크립트에서

<?

if($_GET("opentab")=='b'){

?>

$(".tab_content:first").show();

<? } else { ?>

$("#tab2").show();

<? } ?>

 

저는 겨우 소스만 찾아 붙여넣기 하는 정도의 수준이라, 어떻게 적용시켜야 할지, 나름 이것저것 시도는 해보았는데

오류가 나거나 적용이 안되더군요.

xe에 쓰는 문법이 따로 있는지, 왠지 구현될 것 같은데 도저히 방법을 모르겠어요 ㅠ.ㅠ

참고로 xe코어는 1.7.5이구요, 고수님들~~ 도와주세요오~~

 

 

 

ex ) 서브메뉴 2를 클릭했을 경우, a페이지의 tab2가 활성화

 

아래는 소스입니다.

 

-----메뉴----------------------------------------------------------------------------

<div id="menu">
 <div id="nav">
  <ul>
    <li><a href="si_sub1_1">메뉴1</a></li>
    <li><a href="si_sub2_1">메뉴2</a>
       <ul>
        <li><a href="#" >서브메뉴1</a></li>
        <li><a href="#" >서브메뉴2</a></li>
        <li><a href="#" >서브메뉴3</a></li>
        <li><a href="#" >서브메뉴4<</a></li>
       </ul>
   
    </li>
    <li><a href="si_sub3_1">메뉴3</a></li>
    <li><a href="si_sub4_1">메뉴4</a></li>
    <li><a href="si_sub5_1">메뉴5</a>
      <ul>
        <li><a href="si_sub5_1">메뉴6</a></li>
        <li><a href="si_sub5_2">메뉴7</a></li>
        <li><a href="si_sub5_3">메뉴8</a></li>
      </ul>
    </li>
    <li><a href="#">메뉴9</a>
      <ul>
        <li><a href="#">서브메뉴5</a></li>
      </ul>
    </li>
  </ul>
 </div>
</div>
</div>
--------------------------------------------------------------------------------------------

 

 
 
----------b페이지-------------------------------------------------------------------------
 
<script type="text/javascript">
$(function() {
 $(".tab_content").hide();
 $(".tab_content:first").show();

 $("ul.tabs li").click(function() {
 $("ul.tabs li").removeClass("tabs1").css("color","#000");
 //$(this).addClass("active").css({"color": "darkred","font-weight": "bolder"});
 $(this).addClass("tabs1").css("color","#fff");
 $(".tab_content").hide()
 var activeTab = $(this).attr("rel");
 $("#"+activeTab).fadeIn()
 }); 
});
</script>

<div id="sub2_1">
 
  <div id="container">

    <ul class="tabs">
        <li class="tabs1" rel="tab1">탭1</li>
        <li rel="tab2" class="tabs2">탭2</li>
        <li rel="tab3" class="tabs3">탭3</li>
        <li rel="tab4" class="tabs4">탭4</li>
     </ul>

  <div class="tab_container">

    <div id="tab1" class="tab_content">
       test1
    </div><!-- #tab1 -->
  
    <div id="tab2" class="tab_content">
     test2
    </div><!-- #tab2 -->
  
    <div id="tab3" class="tab_content">
     test3
    </div><!-- #tab3 -->
   
 </div> <!-- .tab_container -->

</div> <!-- #container -->

</div>

------------------------------------------------------------------------------------