2012-01-20 9 views
1

私は2つの簡単なテストページを作成しました。一方はXMLHttpRequestを使用して他方をロードします。 (画像を表示するためにスリムボックスを使用しているページ) これは初めて完全に動作します。しかし、もう一度それを実行しようとすると、ボタンをもう一度押すことで、もう動作しません。私はページ全体をリロードすると、初めて再び動作します。スクリプトなどをアンロードまたは再ロードする必要がありますか? 私が知っているのは、スクリプトタグの倍数です。理由はわかりませんが、最初に動作させるための唯一の方法です。どのようにそれは最初だけ動作しますか?ajaxでロードされたJavascriptのみが初めて動作します

助けてください。

testajax.php

<html> 
<head> 
<link rel="stylesheet" href="SlimBox/css/slimbox.css" type="text/css" media="screen" /> 


<script id="script1" type="text/JavaScript"></script> 
<script id="script2" type="text/JavaScript"></script> 
<script type="text/javascript" src="SlimBox/js/mootools.js"></script> 
<script type="text/javascript" src="SlimBox/js/slimbox.js"></script> 

<script type="text/javascript"> 
function loadXMLDoc(Page) 
{ 
var xmlhttp; 
if (window.XMLHttpRequest) 
{// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
} 
else 
{// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange=function() 
{ 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("myDivFull").innerHTML=xmlhttp.responseText; 
    document.getElementById('script1').src = 'SlimBox/js/mootools.js'; 
    document.getElementById('script2').src = 'SlimBox/js/slimbox.js'; 
    } 
} 
xmlhttp.open("GET",Page,true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 
    <input id="Header2" type="button" onClick="loadXMLDoc('testImage.php')" name='Sok' value='Load' >    
    <div id="myDivFull"></div> 
</body> 
</html> 

testImage.php

<a href='img/facebook-icon.png' rel='lightbox' cap='test'><img alt='' border='0' src='img/facebook-icon.png' /></a> 

EDIT: gilly3によって提供される方法は、しかし、私はそれが仕事を得ることができない、別々のjsファイルと完全に働きました私は機能にGoogleのガジェットのスクリプト 'リンク'を追加する場合。これは多分別の方法で解決されるでしょうか?以下は私が働くことができないコードです。

function addScript(src) 
{ 
    var script = document.body.appendChild(document.createElement("script")); 
    script.src = src; 
} 

if (xmlhttp.readyState==4 && xmlhttp.status==200) 
{ 
    document.getElementById("myDivFull").innerHTML=xmlhttp.responseText; 
    addScript('//www.gmodules.com/ig/ifr?url=http://www.mortgage-info.com/gadgets  
    /gadgetsmortgagecalculator.xml&amp;synd=open&amp;w=250&amp;h=200& 
    amp;title=Mortgage+Calculator&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999& 
    amp;output=js'); 
} 

ありがとうございます。

+0

Pleeeease use jQuery – cambraca

+0

スクリプトURLの末尾にnonceパラメータを追加しようとしましたか? – Pointy

+0

なぜjavascriptファイルを再読み込みしていますか?私はそれを行うより良い方法があると確信しています。 –

答えて

3

確かに、あなたがしようとしていることを達成するためのより良い方法があります。しかし、私はあなたが何をしようとしているのか分かりません。あなたの質問に簡単な答えがあります:

空のスクリプトタグの作成に気を付けません。あなたが動的に好きと同じくらい多くのスクリプトタグを追加します。

function addScript(src) 
{ 
    var script = document.body.appendChild(document.createElement("script")); 
    script.src = src; 
} 

if (xmlhttp.readyState==4 && xmlhttp.status==200) 
{ 
    document.getElementById("myDivFull").innerHTML=xmlhttp.responseText; 
    addScript('SlimBox/js/mootools.js'); 
    addScript('SlimBox/js/slimbox.js'); 
} 


編集:は、「より良い方法は、」あなたが欲しいんどの関数を作成することで、あなたが必要なときにそれを呼び出しますに。例えば、あなたのスクリプトが含まれている場合:

someArray = window.someArray || []; 
var elements = document.querySelectorAll(".someClass"); 
for (var i = 0; i < elements.length; i++) 
{ 
    someArray.push(elements[i].value); 
} 

あなただけの機能を作成します。

var someArray = []; 
function reInit() 
{ 
    var elements = document.querySelectorAll(".someClass"); 
    for (var i = 0; i < elements.length; i++) 
    { 
     someArray.push(elements[i].value); 
    } 
} 

次に、あなたがあなたのAJAXのデータを受信するたびにそれを呼び出します。

+0

yess !! !!ありがとうございました!単純なことを想像して、ちょうど私の一日を作った。あなたの芸人。ありがとう。 – user1149557

+0

こんにちはgilly3 ...どうすればgoogleガジェット用のスクリプトを "addscript"関数に挿入すればうまくいかないのでしょうか?このように.. addScript( '//www.gmodules.com/ig/ifr?url=http://www.mortgage-info.com/gadgets/gadgetsmortgagecalculator.xml & synd = open & w = 250 & h = 200 &タイトル=住宅ローン+電卓&ボーダー=%23ffffff%7C3px%2C1px +ソリッド+%23999999 &出力= js '); – user1149557

関連する問題