Question

当用于将文件加载到div中时，使用jquery加载似乎很容易

$('#div1').load('ajax/test.html');

但是我将我创建的div添加到标签中。我有类似

的东西

<div id="tabs">
<ul>
<li><a href="#tabs-1">one</a></li>
<li><a href="#tabs-2">two</a></li>
</ul>
<div id="tabs-1">
this is tab 1
</div>
<div id="tabs-2">
this is tab 2
</div>
</div>

我的js看起来像

    $(document).ready(function() {
$("#tabs").tabs();
    $('#tabs-1').load('testing.html');
});

然而，tab-1中没有显示任何内容，我搜索过，并且在使用html文件加载标签时没有找到任何内容编辑：目录结构的图像：！（http://s11.postimg.org/hwj34tlir/snapshot1.png）

testing.html是我要加载到选项卡中的内容。 projectscript是我的javascript文件 htmlPageWithTabs是我的html页面

我改变了路径 ../files/testing.html它似乎仍然无法正常工作。我错过了什么？

Answer 1

您能否提供有关要加载的文件的实际路径的更多信息？

我认为有两种选择：

您正在尝试从外部网址加载内容，但由于same origin policy
您正在尝试从服务器加载文件，但是您没有调用正确的路径（在开头时缺少“/”）

Answer 2

您可以使用以下回调来查看错误。

$(document).ready(function() {
  $("#tabs").tabs();

  $("#tabs-1").load("testing.html", function(response, status, xhr) {
    if (status == "error") {
      alert(xhr.status + " " + xhr.statusText);
    }
  });
});

Answer 3

试试这个：

<div id="tabs">
<ul>
<li><a href="#tabs-1">one</a></li>
<li><a href="#tabs-2">two</a></li>
</ul>
<div id="tabs-1">
<iframe src="http://www.google.com"></iframe> 
</div>
<div id="tabs-2">
<iframe src="http://www.youtube.com"></iframe> 
</div>
</div>

没有javascript。

让我知道一些事情

Answer 4

试试这个

$('#tabs-1').append("<div id='content1'></div>");
$('#tabs-1').find('#content1').load("test.html");

如何将html文件加载到jquery选项卡中

4 个答案: