刷新的div無法訪問外部javascript文件

Question

我正在使用JavaScript/jQuery將頁面加載到div中。

我的問題是，我希望一些函數在這個加載的頁面中工作。如果我將需要的函數與HTML一起添加到腳本標記中，那麼它可以正常工作，但這看起來很亂，我想知道是否有其他方法可以從附加的JavaScript文件中工作？

編輯：我會更好地解釋我的意思。

我已經在我的頭連接的腳本，像這樣

<script src="custom.js" defer="defer"></script> 

這個腳本中

我有一個函數：現在內加載view_users股利（＃主視圖）

$(document).ready(function() { 
$('a#view-users').click(function() { 

    $('#main-view').load('view_users.php'); 

    } 
    ); 

}); 

。 PHP。在view_users.php我需要執行ajax搜索，所以我在我的custom.js文件中添加了另一個函數。問題是＃main-view div中的任何內容都不能使用我的custom.js文件中的內容。我想知道我是否可以解決這個問題，同時仍然在頭文件中添加腳本，而不是將其添加到我的view_users.php文件中，該文件非常混亂。

Answer 1

我認爲你需要調用getScriptjquery function在load回調類似的東西，希望能解決你的問題：

$('#result').load('ajax/test.html', function() { 
     $.getScript("ajax/test.js"); 
}); 

有另一種解決方案使用jquery deferred promise。

Answer 2

你可以更具體（即：代碼示例）。你的意思是你加載的頁面內部的腳本標記不工作，即：

<script type="text/javascript" src="jscript"></script> 

，或者你想附加到DOM元素的事件，當您加載新的HTML到DIV不工作？如果是這樣的話，您應該使用jQuery的'on'方法，因爲您要添加到頁面的元素不會監聽您之前附加處理程序所處理的事件。下面是jQuery'on'方法的重載，當你將它們附加到Dom時，將處理程序附加到新元素上。

$('#myDiv').on('click', '#loadedPageElement', function(e) { 
    alert('clicked'); 
    e.preventDefault(); 
}); 

第二個參數將附加的事件處理程序既在本，並且還用於在未來選擇匹配的所有元素的給定的選擇匹配元素。

嗨再次，

defer屬性會直到初始頁面加載延遲腳本的執行，我不知道這是你以後的行爲。然後，它會在（'a＃view-users'）上設置一個事件處理程序，當它被點擊時它將允許（'view-users.php'）加載到（'＃main-view'）中。如果您有需要與一旦加載，您將需要使用$。對（）的「視圖users.php」生成的HTML工作邏輯，如果一個事件的安裝是需要如：

$(document).ready(function() { 
$('a#view-users').click(function() { 

    $('#main-view').load('view_users.php'); 

}); 

$('#main-view').on('click', '#loadedPageElement', function(e) { 
    alert('clicked'); 
    e.preventDefault(); 
}); 

}); 

or if you just want some code to run then a callback function is sufficient: 

$(document).ready(function() { 
    $('a#view-users').click(function() { 

     $('#main-view').load('view_users.php',function(){ 

      alert('code running after load of "view_users.php"') 

     }); 

    }); 

}）;

既不應該要求你有代碼寫在你的內嵌加載的PHP。

您好，

只是爲了清楚起見，是（「一個＃視圖用戶」）在初始頁面加載或在「view_users.php」由AJAX加載的元件？

嗨，

我想通過自己的暗示和其他一些人是你所遇到的問題，如果你有你的頭腳本與被加載到（'＃主視圖元素交互'），即使您的原始代碼使用正確的Jquery選擇器，新加載的元素也不會被識別爲相同的元素，這就是爲什麼您需要使用回調函數作爲加載方法的第二個參數或使用'on'方法。 'on'方法與標準的jQuery事件一起工作，包括'load'，即將一個元素加載到dom中。例如

$("#containerElement").on('load','#newlyLoadedElement',function(e){ 

     //Do some stuff when the element'#newlyLoadedElement' is inserted 
     // into "#containerElement" 
}) 

Answer 3

這裏有一個的jsfiddle http://jsfiddle.net/9MfMS/2/如果你的正在試圖做的是從另一個頁面加載HTML和附加事件處理程序的給它。

//the html that is loaded 
<div id="#clickMe">Click Me</div> 

//attach event handler to it 
$(document).on('click','#clickMe',function(){ 
    alert("Function invoked on html from different page."); 
});