jQuery UI选项卡获取选项卡上的脚本单击和页面刷新

Question

首次为个人项目测试UI选项卡。包括我到目前为止。我需要加载2个独立的脚本，当我点击Tab 2和Tab 3时创建一个div。我之前在使用jQuery getScript时做了这些，当时我有一些链接的onclick函数。使用UI标签可以做到这一点吗？如果是这样，怎么样？

<li><a onclick="loadTabtwo()">Tab 2</a></li> 
<li><a onclick="loadTabthree()">Tab 3</a></li> 

function loadTabtwo() { 
    $.getScript("//tab2.js"); 
} 
function loadTabthree() { 
    $.getScript("//tab3.js"); 
} 

这里是我的功能激活标签，并有刷新页面的当前标签刷新。

jQuery(function($) { 
    var index = 'qpsstats-active-tab'; 
    var dataStore = window.sessionStorage; 
    var oldIndex = 0; 
    try { 
     oldIndex = dataStore.getItem(index); 
    } catch(e) {} 
    $("#tabs").tabs({ 
     active: oldIndex, 
     activate: function(event, ui) { 
      var newIndex = ui.newTab.parent().children().index(ui.newTab); 
      try { 
       dataStore.setItem(index, newIndex); 
      } catch(e) {} 
     } 
    }); 
}); 

这里是HTML

<div id="tabs"> 
    <ul> 
    <li><a href="#tabs-1">Tab 1</a></li> 
    <li><a href="#tabs-2">Tab 2</a></li> 
    <li><a href="#tabs-3">Tab 3</a></li> 
    </ul> 

    <div id="tabs-1"> 
    <p>Tab 1 Content Here</p> 
    </div> 
    <div id="tabs-2"> 
    Load Script 2 Here - loadTabtwo() 
    </div> 
    <div id="tabs-3"> 
    Load Script 3 Here - loadTabthree() 
    </div> 
</div> 

Answer 1

我相信这是你想要的，但我不认为你已经拥有的是因为每次最好的做法你的标签就会对要去点击再次获得脚本

$("#tabs").tabs({ 
    active: oldIndex, 
    activate: function(event, ui) { 
     // ui.newTab.index() gets the index of which tab is active 
     //watch the index start from 0 
     if(ui.newTab.index()==1){ 
      $.getScript("//tab2.js"); 
     } 
     else if(ui.newTab.index()==1){ 
      $.getScript("//tab3.js"); 
     } 

     var newIndex = ui.newTab.parent().children().index(ui.newTab); 
     try { 
      dataStore.setItem(index, newIndex); 
     } catch(e) {} 
    } 
});