在html更改上重新加載javascript

Question

在我的網站的index.html中，我有一個div元素，當點擊一個菜單項（使用jquery）時發生更改。插入到這個元素中的頁面都有一些javascript函數。但是，我正好在body關閉之前將我的JavaScript文件加載到index.html中。當這個div元素改變時，這些文件不會'重新加載'，所以javascript在這些頁面上不起作用。我將如何解決這個問題？我必須重新加載JavaScript文件對元素的更改嗎？如果是這樣，怎麼樣？

編輯： 對不起，這些都爲頁面插入代碼：

$("li.load-page").click(function() { 

    var pagina = $(this).data("page") + ".html"; 
    console.log(pagina); 
    $("#main-content").load(pagina); 
}); 

主要內容是index.html中的空div。

在這種被插入我使用jQuery的手風琴在我的HTML例如頁面之一，但由於它包含在頭它不工作，並在頁面上不插入刷新：

$(function() { 
    $("#accordion").accordion({ 
     collapsible: true, 
     heightStyle: "content" 
    }); 
}); 

EDIT2：我模擬我的問題在這裏：https://jsfiddle.net/ktoeon2f/2/

Answer 1

<script type="text/javascript" id="jsid"> 
//your script here 
</script> 

after onchange call 

eval(document.getElementById("jsid").innerHTML); 


after load 

$("li.load-page").click(function() { 

    var pagina = $(this).data("page") + ".html"; 
    console.log(pagina); 
    $("#main-content").load(pagina); 

    eval(document.getElementById("jsid").innerHTML); 
    // give an id (jsid) to script tag inside your loaded page 
}); 

Answer 2

的問題在這個線程解決：jQuery: Changing the CSS on an element loaded with ajax?

的解決辦法是在Ajax調用的succes函數加載其他功能（S）：

$('#main-content').load(
    url, 
    function(){ 
     accordionFunction(); 
    } 
);