2017-02-18 10 views
1

index.htmlページがあり、次に.htmlという2つのファイルがJQuery .load()関数を使用してindex.htmlの各divにロードされます。JQueryでロードされたHTMLセクションで動作するすべてのJavascriptを取得する方法.load()

これらのファイルには、それぞれ異なるソースファイルの異なるスクリプトを使用するコンテンツがあります。私はそれらをすべてindex.htmlに入れましたが、2つの異なる.htmlファイルのセクションのJavascriptは機能しません。

<script src>を他の2つの.htmlファイルに追加すると、ページが非常にゆっくりと実行されても、それらのセクションのJavascriptが正しく機能しません。

私の質問は、すべてのスクリプトとソースファイルをどこからでも利用できるようにする方法がある場合です。

これらのスクリプトは、index.htmlに挿入され、index.htmlにすべてのスクリプトsrcのinclusionsが含まれている場合、これらのスクリプトが動作しないのはなぜですか?私はあなたの問題を再現しようとしている

おかげ

答えて

0

。これは、それぞれの機能を有する2つの外部スクリプトが含まれていたIDを持つ各DIVにおける

index.html->負荷2つのHTMLファイル(1,2)

<!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ページでここ

上記と同じ

2つの外部ファイル(load1.html、load2.html)二つのファイル。これらの彼らの外部スクリプトファイルで定義されたクリック機能を持つボタンが含まれてロードされます。すべてがindex.htmlにロードされ、それぞれがクリックが適切に実行されています。

Plunker linkプレビュー

関連する問題