Question

首先，我希望每个人都知道我是绝对的初学者所以请耐心等待我。

我想知道如何将整个html页面放在div中。我尝试$("#footballPlayers").html("footballplayers.html");，但它显示footballplayers.html文字而不是整页。

的index.html：

<html>
<head>
<script type="text/javascript" src="jquery1.6.4min.js"></script>
<script type="text/javascript">
 $(function(){
  $("div#tabFootballPlayers").click(function(){
    $("#footballPlayers").html("footballplayers.html");
    $("#actionStars").html("");
    $("#directors").html("");
  });
 });

 $(function(){
  $("div#tabActionStars").click(function(){
   $("#actionStars").html("actionstars.html");
   $("#footballPlayers").html("");
   $("#directors").html("");
  });
 });

 $(function(){
  $("div#tabDirectors").click(function(){
   $("#directors").html("directors.html");
   $("#actionStars").html("");
   $("#footballPlayers").html("");
  });
 });
</script>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
<div>
 <div id="tabFootballPlayers">Football Players</div>
 <div id="footballPlayers"> </div>
 <div id="tabActionStars">Action Stars</div>
 <div id="actionStars"> </div>
 <div id="tabDirectors">Directors</div>
 <div id="directors"> </div>
</div>
</body>
</html>

Answer 1

您使用.load()功能：

$("#footballPlayers").load('footballplayers.html body');

注意URL后面的选择器。您可以从该页面中选择元素。我认为您需要body，因为嵌套的<html>代码可能会结束。

关于您的代码的更多评论：

您不要多次使用此功能。只需将所有代码推入其中：

$(function() {
  // All of your code here.
});

我更喜欢这种语法，因为它看起来更实用，并向您展示它的作用：

$(document).ready(function() {
  // All of your code here.
});

此外，您的代码实际上是多余的。尝试冷凝它：

$(document).ready(function() {
  $("#your_menu_container div").click(function() {
    $(this).load(this.id.substr(3).toLowerCase() + '.html').siblings().html('');
  });
});

Answer 2

使用负载

jQuery("#footballPlayers").load("footballplayers.html");

了解更多详情click here

Answer 3

替换

$("#directors").html("directors.html");

与

$("#directors").load("directors.html");

您加载的html文件应该只包含DIV的内容 - 即不是<head> <body>甚至导航 - 只是内容

Answer 4

您可以使用load：

$("#div1").load("myhtmlpage.htm");

Answer 5

尝试：

$("#footballPlayers").load("footballplayers.html");

Answer 6

您需要使用AJAX实际加载footballplayers.html的内容，然后将其放入div中。

试试这个：

$("#footballPlayers").load("footballplayers.html");

.load使用AJAX获取页面，然后将其加载到div中。

Answer 7

使用您的代码，您使用常量字符串“footballplayer.html”填充html代码。

您可以使用加载方法，这是一个示例：

$('#footballPlayers').load('footballplayers.html');

它通过AJAX获取您请求的页面并填充元素。

Answer 8

我在load火车上：

$("#div1").load("myhtmlpage.htm");

如何使用jquery将整个html页面放在div中？

的index.html：

8 个答案: