2010-03-29 39 views
2

我想調用一個回調方法,該方法可能會或可能不會在由jQuery選項卡作爲Ajax內容加載的頁面中實現。換句話說,我有一組jQuery選項卡,用於加載JSP文件中呈現的內容。其中一些文件在其中包含額外的Ajax內容,有些則不。調用由jQuery選項卡加載的內容頁面中定義的函數

我能做的是:

$(document).ready(function() { 
    $("#menu").tabs({ 
     cache: false, 
     ajaxOptions: {cache: false}, 
     load: function(event, ui) { 
      if (ui.index == index_of_tab_with_additional_content) { 
       //call code defined in other places and embedded using <script> tags 
      } 
     } 
    }); 
}); 

但是,有一些缺點 - 所有的回調必須嵌入我的主要標籤頁中的腳本來聲明,與任何一起,他們可以依靠 - 不優雅!另外,我希望能夠調用相同的回調函數,以避免逐頁if/else語句。總之,我想有類似的東西

load: function(event, ui) { 
     callback(); //Each tab would implement this differently, or not at all 
    } 
} 

不幸的是,我想不出如何調用內容中聲明的腳本函數。正如在其他線程中指出的那樣,jQuery並未加載JavaScript。

顯然必須爲此設置一個選項,但我找不到哪個選項。

如果選項設置和JS加載,我將如何訪問函數?它會是ui.panel.funcname(); ?

謝謝, ES

回答

2

JQuery的將不加載位於文檔的標題腳本內容通過AJAX被加載,但從身體它將負載腳本內容。如果您不希望主頁上的代碼(使用live處理程序),則處理此問題的最簡單方法是讓您的主頁加載任何選項卡所需的任何外部腳本文件,並讓每個選項卡的內容包含「回調」加載標籤時需要完成的工作的機制。您需要小心,因爲意識到所有標籤都可能在DOM中加載,因此需要命名標籤之間的區別,或許可以限定任何選擇器,以使它們與標籤容器相關,但這是可行的。

Ex。

<html> 
    <head> 
     ... 
     <script type="text/javascript"> 
      // I'm not going to be loaded via AJAX 
     </script> 
    </head> 
    <body> 
    <div id="homeTab" class="tab-content"> 
     ... 
     <a href="#" class="clickable button">Click Me</a> 
     ... 
    </div> 
    <script type="text/javascript"> 
     $(function() { 
      // here be stuff which runs when the tab is loaded 
      var $tab = $('#homeTab'); 
      $('a.button',$tab).click(function() { 
       ...do something... 
       return false; 
      }); 
     }); 
    </script> 
    </body> 
    </html> 
+0

Grats on 100k tvan :) – 2010-03-29 22:01:11

+0

@Nick - 謝謝。 – tvanfosson 2010-03-29 22:03:25

相關問題