如何讓所有Javascript處理使用JQuery .load（）加載的html部分

Question

我有一個index.html頁面，然后是另外兩個.html文件，它們使用JQuery .load（）函數加載到index.html各自的div中。

每個文件中都有使用不同源文件的不同腳本的內容。 我將它們全部包含在index.html但是來自兩個不同.html文件的部分中的Javascript不起作用。

如果我將所有<script src>添加到另外兩個.html文件中; 頁面運行速度非常慢，即便如此，這些部分的Javascript也無法正常運行。

所以我的問題是，是否有辦法讓所有腳本和源文件在任何地方都能正常工作。

如果這些腳本只是插入到index.html並且index.html包含所有腳本src，為什么這些腳本不能用於這些加載的部分呢？

謝謝

Answer 1

我試圖重現你的問題。 這是如下

index.html->在id（1,2）的相應div中加載兩個html文件

<!DOCTYPE html>
<html>

<head>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
</head>

<body>
  <h1>Hello Plunker!</h1>
  <div id="1"></div>
  <div id="2"></div>

  <script>
    $('#1').load("load1.html"); //load html
    $('#2').load("load2.html"); //load html
  </script>
</body>

</html>

load1.html

<button onclick="function11()">Load11(function 1)</button>
<button onclick="function12()">Load12(function 2)</button>

<script src="script1.js"></script>
<script src="script2.js"></script>

這包含兩個具有相應功能的外部腳本

load2.html

<button onclick="function21()">Load21(function 1)</button>
<button onclick="function22()">Load22(function 2)</button>

<script src="script3.js"></script>
<script src="script4.js"></script>

與上述相同

這里在index.html頁面中加載了兩個外部文件（load1.html，load2.html）。這兩個文件包含在其外部腳本文件中定義了click函數的按鈕。 所有都在index.html中加載，每個單擊都正在執行。

用於預覽的Plunker鏈接

如何讓所有Javascript處理使用JQuery .load（）加載的html部分

問題描述

1 個解決方案

解決方案1
0 2017-02-18 09:05:33

如何讓所有Javascript處理使用JQuery .load（）加載的html部分

問題描述

1 個解決方案

解決方案1 0 2017-02-18 09:05:33

解決方案1
0 2017-02-18 09:05:33