如何使用製表符將HTML加載到單個div

我有腳本安裝程序以在菜單項上切換顯示/隱藏div。如何使用製表符將HTML加載到單個div

但是我想加載外部HTML到其中一個，並遇到問題。

現在我只想讓菜單項將外部HTML加載到單個div中。

我似乎無法使它雖然工作，我想有這樣的菜單：

<div id="topmenu"> 
<a href="#" >Home</a> 
<a href="#" >Videos</a> 
<a href="#" >Follow</a> 
<a href="#" >Contact</a> 
</div>

每個項目加載不同的HTML到像這樣使用jQuery一個div：

<article> 
<div id="bodycontent"> 
... 
</div> 
</article>

來源

2016-10-11 Korey Nadolny

沒有足夠的信息給出哪個是從外部獲取數據的信息。總是顯示你已經嘗試過 – charlietfl

Ive嘗試了很多從在線搜索，即時到我只是想重做它乾淨的點，但最好的方法是 –

如果你想添加或者說是加載外部html，那麼你需要添加一些java scrip.Let拿你的例子。

<div id="topmenu"> 
<a href="#" id='homeTab'>Home</a> 
<a href="#" id='videoTab'>Videos</a> 
<a href="#" id='followTab'>Follow</a> 
<a href="#" id='contactTab'>Contact</a> 
</div>

見我添加了單獨的ID每個現在你需要調用JS

$("#homeTab").on('click',function(){ 
    //firstly clear html part 
    $('#bodycontent').html(''); 
    $('#bodycontent').load('hometab.html');//put your exact loaction of html file in my case I'm assume both are in same folder. 
});

這就是它全部搞定，你可以做這樣的負載功能。

希望它能爲你工作。

來源

2016-10-11 17:10:35

好吧，所以我需要做，在這個例子中，4個不同的下面的代碼與每個ID和網址的實例？ –

$（「＃homeTab」）。on（'click'，function（）{0}首先清除html部分 $（'＃bodycontent'）。html（''）; $（'＃bodycontent'）。 load（'hometab.html'）; //把你的html文件的確切位置放在我的案例中我假設它們都在同一個文件夾中。 –

對不起，即將推出新的stackoverflow，所以我不知道如何編輯或刪除評論 –

如何使用製表符將HTML加載到單個div

回答

相關問題