動態插入另一個HTML文件？
[英]Insert one HTML file in another dynamically?
問題描述
有2個html文件，file-1.htm和file-2.htm。 還有另一個html文件test.htm，下拉列表有2個值，“Load Sample-1”和“Load Sample-2”。
這就是我正在嘗試的：當從下拉列表中選擇“Load Sample-1”時，file-1.htm應作為嵌套html加載到test.htm中。
現在我可以通過在test.htm中包含file-1.htm和file-2.htm的內容來通過javascript實現這一點。 隨着下拉變大，test.htm會變得龐大。 如何通過為下拉列表中的每個條目分別創建html文件來實現這一目標？
4 個解決方案
解決方案1
8 已采納 2009-05-22 20:09:45
為什么不使用<iframe> ，然后讓JavaScript動態更改iframe的來源？
這是一個簡單的頁面，演示如何使用它：
<html>
<head>
<script type="text/javascript">
var changePage = function() {
var iframe = document.getElementById("myiframe"); // One of the many ways to select your iframe
var select = document.getElementById("pageselected");
var url = select.options[select.selectedIndex].value;
iframe.src = url;
}
</script>
</head>
<body>
<select id="pageselected">
<option value="page1.html">Page 1</option>
<option value="page2.html">Page 2</option>
</select>
<input type="button" onclick="changePage()" value="Change Page" />
<iframe id="myiframe"></iframe>
</body>
</html>
您可能會問自己“為什么他不僅僅使用onchange來<select> ？嗯，我在這里詳細介紹了<select> + onchange ，但是基本上使用它會使您的網站無法訪問使用Internet Explorer 6或7的僅限鍵盤的用戶。（不確定它是否仍在8中斷開）
解決方案2
5 2009-05-22 20:56:27
如果你使用JQuery，他們有一個奇特的函數jquery（'＃div'） 。load （） http://jquery.com/ http://docs.jquery.com/Ajax/load
效果很好，還支持GET和POST參數。
解決方案3
0 2009-05-22 20:12:23
如果下拉是“巨大的”，那么我建議不再使用下拉菜單並查看一些現有的自動完成框以供您選擇的語言。
如果有數百個選項，則下拉列表不再是適當的表單元素。
解決方案4
0 2009-05-22 20:12:46
您可以使用AJAX來完成此任務。 有一百萬種不同的AJAX教程可以向您介紹該技術。
有沒有一種方法可以將發布數據動態插入到在其他地址加載的html文件中？
[英]Is there a way to insert post data into html file loaded at a different address dynamically?
如何將數據從一個html頁面動態添加到另一個html頁面中的列表
[英]how to dynamically add data from one html page to a list in another
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.