2011-05-10 4 views
1

jQuery UI 탭에 문제가 있습니다. 세부 사항에서, 나는 아약스와 함께로드하는 탭이 있는데 내 문제는 페이지 내에서 페이지 링크를로드하려고하지만 그것을 만들 수 없다는 것입니다.jQuery UI 탭 문제 탭에서 링크로드 중

<script> 
$(function() { 


$("#tabs").tabs({ 
    ajaxOptions: { 
     error: function(xhr, status, index, anchor){ 
      $(anchor.hash).html(
       "Could not load this tab"); 
     } 
    } 

}); 


}); 
</script> 

<div id="tabs"> 
<ul> 
<li><a href="#tabs-1">Welcome</a></li> 
<li><a href="customer.php">Customers</a></li> 
<li><a href="subscribers.php">Subscribers</a></li> 
<li><a href="subscription.php">Subscriptions</a></li> 
    </ul> 

</div> 

이의 내가 탭 구독을로드가 알고 가정 해 봅시다 :

은 탭 내 페이지의 코드입니다. subscription.php에는 동일한 탭에서로드하려는 다른 페이지에 대한 링크가 있습니다.

어떻게 작동시킬 수 있습니까?

+0

궁금한 점이 있다면 탭 안의 페이지 콘텐츠가 포함 된 iframe을 탭에 넣는 것이 더 간단하지 않으며 일반적인 앵커 링크 동작이 작동합니까? –

답변

1

이렇게하는 데는 몇 가지 방법이 있지만 여기에는 간단한 방법이 있습니다.

링크에 ID를 부여하십시오 (예 : '링크'). 원하는 div로 페이지의 .load를 수행하도록 클릭 핸들러를 설정하십시오. 따라서 :

<a href="#" id="link"> 

<script type="text/javascript"> 
    $('#link').click(function() { 
      $('#tabid').load('linkpage.html'); 
    }); 
</script> 

자, 몇 가지 설명. 내용을로드하고 싶은 탭의 div에 id를 지정해야합니다 ... 저는 이것을 그림 목적으로 tabid라고 부릅니다. 로드는 페이지의 내용 (linkpage.html)을 가져 와서 div tabid의 새 값으로 설정합니다. 기본적으로, 당신은 외부 콘텐츠를 가지고 내부 html을하고 있습니다.

+0

안녕하세요. 이게 내가 찾고 있었던거야. 고마워! – user729334