0

基本的に、AJAX を使用してさまざまなページで満たされた div を持つメイン ページである Web ページを作成しました。これは基本的に、innerHTML を使用してページを div にロードすることで機能します。私が遭遇した 1 つの問題は、javascript を含むページがその div に読み込まれると、他のすべてのコードが正常に実行されることでした。JavaScriptだけが機能しません。

メインページ(index.php):

<html>
<head>
<script type="text/java">
////bunch of functions////
////Ends up that page_request on this instance is 'graph.php'////
document.getElementById('mydiv').innerHTML=page_request.responseText
</script>
</head>
<body>
<div id="mydiv"><div>
</body>
</html>

子ページ(div(graph.php)にロード):

<html>
<head>
<link rel="stylesheet" href="mystyle.css" type="text/css" media="screen" />
<script src="other_stuff.js"></script>
</head>
<body>
<script>
///bunch of script////
</script>
</body>
</html>

ページ自体をロードする (graph.php を開く) と、すべてが正常に機能していることに気付きました。これは、graph.php を innerHTML から index.php にインポートして div にインポートしたときに機能しません (エラーは表示されず、何も表示されません)。私は他の多くの投稿やガイドを読みましたが、明確な解決策は思いつきませんでした。私が見たと思う：

  • 私のコードの周りに eval() を入れてください [悪意のあるユーザーの攻撃につながる可能性があるとガイドで見ました]。
  • メイン ページでスクリプトを作成し、次を使用してデータをインポートします。
    • document.createElement() および .parentNode.insertBefore()
  • リスナーを作成し、graph.php を開いたときに関数を呼び出す
  • そして、この良い例

この例がどのように機能するかは100％わかりませんが、javascriptが収集する情報をphpに入力してから、graph.phpでグラフを作成するためです。したがって、その関数を index.php に入れると、php は既に読み込まれているため、ページを更新するか、それらを呼び出して何らかの方法で情報を更新する必要があります。いくつかのコンテキストでは、私はphpで問題ありませんが、私は新しくてjavascriptに苦労しているため、どのソリューションが自分の状況に合っているか、または最適に機能するかわかりません。ヒント/例をいただければ幸いです。お時間をいただきありがとうございます。

4

4 に答える 4

1

コードスニペットから、メインページ内に完全なページを埋め込むことを検討しているようです。その場合、より簡単なアプローチは、iframe代わりに要素を使用することです。

例えば：

 ...
 <div id="main-page-container">
     <iframe src="some-path/graph.php" scrolling="no" frameborder="no"></iframe>
 </div>
 ...

リファレンスと使用例を参照してください。

于 2013-01-05T22:35:05.160 に答える
1

これにはjQueryの.load()関数を使用することをお勧めします。

こちらをご覧ください: jQuery API

于 2013-01-05T22:24:10.570 に答える
0

IE8以下のような古いブラウザでは、JavaScriptを含む文字列を挿入して、どのような形式でも実行することはできません。

たとえば、次のようにします。

function addScriptText(js_code) {
    var element = document.createElement("script");
    element.innerHTML = js_code;
    document.head.appendChild(element);
}

IE8以下では動作しません。

これを実現するには、evalを使用する必要があります。

function addScriptText(js_code) {
    window.eval.call(window, js_code);
}

それ以外の場合は、次のような外部jsファイルを動的にリクエストする必要があります。

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "externalScript.js";
document.getElementsByTagName("head")[0].appendChild(script);
于 2013-01-05T22:34:18.403 に答える
0

注: ロードしているページ (この例では page2.html) は、ロードしているページ (この例では page1.html) と同じドメインにある必要があります。

jQueryを使用した実用的なソリューション:

ページ1：

<!DOCTYPE html>
<html>
<head>
<title>Page 1</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#page2").load("page2.html");
    });
</script>
</head>
<body>
<h1>Page 1 Header</h1>
<div id="page2">
</div>
</body>
</html>

ページ2：

<h2>Page 2 Header</h2>

<script type="text/javascript">
    alert("Page 2 loaded and javascript executed!");
</script>
于 2013-01-05T22:55:08.843 に答える