僅在一個jquery選項卡中加載AJAX頁面

Question

背景：我有類別調用ajax頁面並打印在DIV標籤中。這個AJAX頁面從數據庫中提取內容，並分爲2部分（第1部分常規內容顯示，第2部分jQuery選項卡（功能，規格和下載選項卡））。所有選項卡打印從數據庫中獲取的信息，但最後一個選項卡即Downloads選項卡具有另一個<DIV>標籤，該標籤將加載PDF和ZIP文件的關聯列表供下載。

Issue：我試圖加載文件列表，當用戶點擊下載選項卡上，而不是之前。到目前爲止，我曾嘗試是下面的。系統無法觸發警報消息還返回標籤索引ID

<div id="tabs"> 
    <ul> 
    <li><a href="#tab_feature">Features</a></li> 
    <li><a href="#tab_specification">Specifications</a></li> 
    <li><a href="#tab_download" data-id="3">Downloads</a></li> 
    </ul> 

    <div id="tab_feature"> 
    <div> 
     Tab Features 
    </div> 
    </div> 

    <div id="tab_specification"> 
     Tab Specificications 
    </div> 

    <div id="tab_download"> 
    <p>Below listed are the related files that can be downloaded to you PC.</p> 
     <div id="downloadFilesList"></div> 
    </div> 
</div> 

<script> 
$(function() 
{ 
    $('#tabs').tabs(
    { 
     select: function(event,ui) 
     { 
      var intSelectedIndex = ui.index; 

      alert('selected: ' + intSelectedIndex); 

      if (intSelectedIndex == 2) 
      { 
       $("#downloadFilesList").load('loadfiles.asp', function (response, status, xhr) 
       { 
       ..... 
       } 
      } 
     } 
    }); 
}); 
</script> 

我想補充的，我使用jQuery以下

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" ></script> 
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script> 
<link href="//code.jquery.com/ui/1.11.0/themes/humanity/jquery-ui.css" rel="stylesheet"> 

添加JSFiddle

Answer 1

使用

select: function(event,ui) 

代替

activate: function (event, ui) { 

或

beforeActivate: function(event, ui) {} 

要了解更多關於標籤，請仔細閱讀本Link

編輯

$(document).ready(function() 
{ 
$('#tabs').tabs(
{ 
    activate: function (event, ui) 
    { 
     var intSelectedIndex = ui.index; 

     var intSelectedIndexs=ui.newPanel.selector; 

     if ($.trim(intSelectedIndexs) == "#tab_download") 
     { 
     alert("This is Download:");//$('.downloadFakeClass').load('www.google.com');   
     } 
    } 
}); 
});