使用jQuery加载外部.html文件

Question

我正在尝试创建带有选项卡式浏览的网站，并按照教程进行操作。 但是问题是我当前正在使用的代码确实能按预期工作。

• HTML代码： http ： //pastebin.com/CG146NS3

• CSS代码： http ： //pastebin.com/4VCuAwJm

• JavaScript： http ： //pastebin.com/sZhhQs6v

我遵循的教程是： http : //net.tutsplus.com/tutorials/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/

问题：当我单击其中一个选项卡时，＃content随slideUp消失，.load加载了内容，但确实将内容放置在#content中。

Answer 1

1. 您有一些重复的#ids 。

2. 请记住，当您这样做时：

    var toLoad = $(this).attr('href')+' #content'; // other execution function loadContent() { $('#content').load(toLoad,function(){ $('#content').slideDown('normal'); }); 

您实际上是将页面片段#content加载到页面的#content中。 因此，您最终得到以下结果：

<div id='content'>
   <div id='content'>Random Data</div>
</div>

Answer 2

好的，根据您的评论。只需确保您的随机html文件中确实有ID为#content的DIv。