通過jQuery的load()函數載入進頁面的內容為何js就失效了？

為何每次只能從1.html切換到2.html時有淡入淡出效果，從2.html切回1.html就重新刷新了頁面呢？如果最初載入的是2.html，情況正好相反。

看了很多都說document ready只會載入一次，那我如何通過ajax載入的內容也能產生的事件也能被js聽到？

嘗試過很多辦法都已經失敗了。stackoverflow上很多都不給出源碼所以給出的解決辦法都是沒用的，我這裡將全部源碼貼出不知道能否解決？

/* 1.html */
&
&
&

---

DOM 上面的 #switch 雖然是一樣，但是 DOM 本身不一樣，因為你點擊之後已經替換過了。

改用事件代理應該可以解決，但不是 $("#switch").on("click", "a", function() {，因為你 #switch 這個 DOM 也替換掉了。你應該在更上層的 DOM 上綁定代理，不會改動的 DOM 上。比如本例的 $mainContainer.on(xxxxxx)。

至於事件相關的，可以看下我的這篇文章：JavaScript 和事件

---

你這種情況最好用 event delegation

---

懶人寫法

將

$("#switch a").click(function() {


換成

$(document).on("click","a", function() {


出處～ history.pushState and jQuery

---

謝邀。

顯然只有第一次的dom綁定了click事件，load之後之前的dom已經消失了，新的dom並沒有再次綁定click事件。

至於為什麼沒有再次運行script標籤，我估計load函數是對innerHTML方法的封裝，忽略script標籤。

---

可以先判斷load方法是否執行了，如果執行過了就將原先的賦值給新定義的變數，然後保存下來，再執行load方法時在方法內執行原先保存下來的那個變數就可以實現在不同js文件執行兩次load方法了

---

推薦閱讀：