如何將外部HTML網頁（HTML與腳本功能相隨）加載到當前頁面（DOM）

test1.html如何將外部HTML網頁（HTML與腳本功能相隨）加載到當前頁面（DOM）

<html> 
<head> 
<script src="jquery-1.7.2.js"> 
</script> 
<script> 

function loadfn(){ 

$.get('test.html',function(data){ 

alert($(data).text()); 
//$('body div#returnData').html(data); 
$.each(data, function(i, node) { 
    alert(i); 
    if (node.tagName == "SCRIPT") { 
     eval(node.innerHTML); 

    } else { 
     $(node).appendTo($('#returnData')); 
    } 

}); 

}); 
test1(); 
test2(); 
} 
</script> 
</head> 
<body> 
<div id="returnData" > 
</div> 
<input type="button" value="Click" onclick=loadfn()> 
</body> 
</html>

的test.html：

<html> 
<head> 
<script src="/jquery-ui-timepicker-addon.js"> 
</script> 
</head> 
<script> 
function test1(){ 
alert('test1 function'); 
} 
</script> 
<script> 
function test2(){ 
alert('test2 function'); 
} 
</script> 
<body> 
<div id="testdiv"> 
Text field : <input type="text" value="Test Value"/> 
</div> 
</body> 
</html>

其實我有要求我必須將test.html頁面加載到test1.html中，然後運行test.html頁面中的腳本函數。

以上代碼片段不足以滿足要求。請讓我知道我在代碼片段中做錯了什麼。

來源

2012-04-23 Rajesh

在$ .get中設置返回類型，如$ .get（'url，'data'，callback（），'html'） – chepe263 2012-04-23 16:48:21

腳本沒有加載.. – Rajesh 2012-04-23 17:23:55

的功能是當內容被渲染提供最快......問題是，Ajax調用是異步的，因此TEST1和你的榜樣調用時

未經測試，但嘗試test2的不存在：

編輯：在test.html的html，不應該需要head和body標籤，放置腳本標籤與內容裏面的文件，因爲你在加載HTML的一個子部分，而不是一個全新的頁面

來源

2012-04-23 16:48:23

html頁面test.html被單獨使用對於其他一些請求，所以html，head和body標籤是必需的。我不能改變爲只有腳本標籤的功能。 – Rajesh 2012-04-23 17:05:08

然後你應該提取公共部分作爲單獨的調用加載，並直接包含在其他請求中...現在你將不得不做昂貴的解析和邪惡的eval – 2012-04-23 17:07:24

我想加載HTML頁面與JavaScript函數一起。 – Rajesh 2012-04-23 17:20:02

如何將外部HTML網頁（HTML與腳本功能相隨）加載到當前頁面（DOM）

回答

相關問題