将新的 html 页面动态加载到另一个 DIV (jQuery)答案

【问题标题】：Dynamically load new html page into another DIV (jQuery)将新的 html 页面动态加载到另一个 DIV (jQuery)
【发布时间】：2015-01-25 01:53:09
【问题描述】：

我在网上找到了这段代码，用于将 HTML 页面动态加载到 DIV 中：

<script src="http://code.jquery.com/jquery-1.4.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function(){
           $("#page1").click(function(){
            $('#result').load('page1.html');
             //alert("Thanks for visiting!");
           }); 

           $("#page2").click(function(){
            $('#result').load('page2.html');
             //alert("Thanks for visiting!");
           });
         });
    </script>

但是，我有 3 个 DIV，即标题、导航和内容。我希望导航 DIV 包含 3 个链接，即地质、词汇表和图例。当有人单击链接时，我希望替换标题 DIV 中的内容，而不是导航 DIV。这是我的裸代码，减去上面的 Internet 脚本：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>   
</head>

<body>
<table id="maintable" width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">

  <tr style="width:100%; height:20%">
    <div id="header">dynamically loaded content, Geological Record onload</div>
  </tr>

  <tr style="width:100%; height:5%">
    <td><div id="navigation">Geological Record | Glossary | Legend</div>
  </tr>

  <tr style="width:100%; height:75%">
    <td><div id="content">MAIN CONTENT HTML PAGE</div></td>
  </tr>

</table>
</body>
</html>

【问题讨论】：

用你的元素 id（即导航、内容和标题）替换“#result”会成功吗？
这工作:) 我如何指定加载 georec.html 作为初始页面，即 onload？
我没有得到你的第二个问题，而且 cmets 不是问新问题的好地方 :)
对不起，新来的。只有我的第二个帖子。我如何在此线程中提出问题，以及如何正式表明您回答了我最初的问题？

标签： html dynamic

【解决方案1】：

使用您的元素 ID（即导航、内容和标题）代替“#result”。

【讨论】：