使用純JavaScript中使用的頁面數，我相信這是可能的，如果你使用的加載頁面AJAX。
本教程http://code.tutsplus.com/tutorials/how-to-load-in-and-animate-content-with-jquery--net-26演示了將主頁（我稱之爲索引頁）加載到另一個頁面（我稱之爲子頁面）的方法。據我所知，如果您在子頁面中包含關聯的腳本標記而不是索引頁面，那麼它們是動態的，因爲它們在子頁面加載時加載，並在子頁面卸載時卸載。
我之前在我自己的項目中使用了本教程的修改版本，我沒有像教程中顯示的那樣創建與索引頁面具有相同內容的子頁面，而是僅使用整個子html文件僅針對子頁面的內容。
這裏是基於把你的代碼的例子：
indexScript.js：
/* When index.html is loaded and ready */
$(document).ready(function() {
/* Handels on-click of menu buttons */
$('#mainTabNav a').click(function(){
/* Getting the linked page */
var toLoad = $(this).attr('href');
/* Hiding content and calling loadContent function - creates animation*/
$('#contentDiv').hide('slow', loadContent);
/* Injects content to contentDiv div tag */
function loadContent(){
$('#contentDiv').load(toLoad, '', showNewContent);
}
/* Shows contentDiv div */
function showNewContent() {
$('#contentDiv').show('normal');
}
demonstratePageChange(); //For testing - you can remove this
/* In order to stop the browser actually navigating to the page */
return false;
});
/* Initial Load - load first child page by simulation of clicking on it*/
$('#maintabs_1').click();
});
/* To demonstrate the respective JS script is loaded as needed */
function demonstratePageChange() {
setTimeout(function(){
alert(testMsg); //Alerts the message from resepctive child page script
}, 3000);
}
的index.html：
<!DOCTYPE html>
<html>
<head></head>
<body>
<div id='maintabs'>
<ul id='mainTabNav'>
<a id='maintabs_1' href='childA.html'><li>Tab 1</li></a>
<a id='maintabs_2' href='childB.html'><li>Tab 2</li></a>
</ul>
</div>
<div id='contentWrapper'>
<div id='contentDiv'></div>
</div>
</body>
<script type='text/javascript' src='jquery-2.1.1.min.js'></script>
<script type='text/javascript' src='indexScript.js'></script>
</html>
childA。HTML：
<div id='maintabs-1' class='contentBody'>
<script type='text/javascript' src='childAScript.js'></script>
Child A - Page
</div>
childAScript.js：
console.log("childAScript has been loaded");
var testMsg = "This is Child A";
childB.html：
<div id='maintabs-2' class='contentBody'>
<script type='text/javascript' src='childBScript.js'></script>
Child B - Page
</div>
childBScript.js：
console.log("childBScript has been loaded");
var testMsg = "This is Child B!!!!";
然而，有幾件事情要考慮使用這種方法：
- 這種特殊的方法需要的jQuery
- 此方法不支持重載，你不得不代碼在IE中，如果你在選項卡，你需要的。存儲該事實並刷新，返回標籤2.
- 本地測試 - 據我所知，只有FF在本地測試時支持此功能。例如，如果您想在Chrome上測試此功能，則需要將其上傳到服務器上，然後才能正常工作。這是由於「XMLHttpRequest無法加載」錯誤，如果您在本地嘗試此操作。
我希望這可以幫助和解決您的問題。
如果您點擊後在標籤中加載內容（ajax）會怎麼樣？並在此內容將'加載相應的行。 – sitilge
我的印象是，加載的腳本仍然存在，它們的功能。說tab1.js有一個函數foo（），tab2.js有一個函數foo（）。如果我在選項卡2上，tab1.js中的第一個foo會在第一次加載後首先被調用嗎？我想刪除以前加載的js，所以調用foo（）只會到達tab2.js foo函數 – depperm