Загрузить страницу AJAX только на одной вкладке jquery

Question

Фон: У меня есть категории, которые вызывают страницу ajax и печатают в теге DIV. Эта страница AJAX извлекает содержимое из базы данных и делится на 2 части (отображение 1-го уровня обычного контента, вкладки jQuery второй части (вкладки «Особенности», «Спецификации» и «Загрузки»)). Все вкладки печатают информацию, полученную из базы данных, но последняя вкладка, то есть вкладка «Загрузки» содержит еще один тег <DIV>, который загрузит связанный список файлов PDF и ZIP для загрузки.

Проблема: Я пытаюсь загрузить список файлов, когда пользователь нажимает на вкладку «Загрузки», а не раньше этого. До сих пор, что я пытался это ниже .. Система не может вызвать предупреждающее сообщение и возвращение на вкладку указатель 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');   
     } 
    } 
}); 
});