通过将其他内容保持为静态来加载动态页面/内容 [英] Dynamic page/content loading by keeping other content as static

问题描述

我想在home元素中动态加载html页面，方法是将home.html页面保留为默认值，并在加载另一个html页面时，div元素以外的内容应该是静态的。我怎样才能实现它？请帮忙。
我使用以下代码...

i want to load html page dynamically in my div element by keeping home.html page as default and on loading another html page the content other than div element should be static. How can i achieve it? please help. I am using following codes...

html代码

<nav class="main">
    <a href="home.html">Page 1</a>
    <a href="contact.html">Page 2</a>
    <a href="about.html">Page 3</a>
    <a href="product.html">Page 4</a>
    <a href="page5.html">Page 5</a>
</nav>

<div id="dynamic">
</div>

我的jquery代码是

and my jquery code is

$(document).ready(function(){
    $('a').click(function(){
        $('#dynamic').load('home.html');
        return false;
    });
})

推荐答案

尝试这种方法。加载目标网址应该基于已点击的链接。

Try this approach. The loading target url should be based on the link that has been clicked.

$(document).ready(function(){
    $('nav a').click(function(event){
        event.preventDefault();

        $('#dynamic').load($(this).attr('href'));

        return false;
    });
})

请参阅示例 jsfiddle 。

这篇关于通过将其他内容保持为静态来加载动态页面/内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！