如何使用jQuery进行部分页面更新? [英] How to do partial page update with jQuery?

问题描述

我有导航菜单.单击后，仅应从html内容文件(服务器中的内容)更新页面内容div，而无需刷新整个页面.

I have navigation menu. When clicked, only page content div should be updated from html content file (that in the server) without doing a full page refresh.

如何使用jQuery实现此目标?

How can I achieve this using jQuery?

推荐答案

按照常规方式构建菜单，即

<ul id="menu">
    <li><a href="about-us.html">About Us</a>
    <li><a href="services.html">Services</a>
    <li><a href="products.html">Products</a>
</ul>

以及内容的占位符.

<div id="content"></div>

然后运行与此类似的代码

$("#menu li a").click(function(e) {
    // prevent from going to the page
    e.preventDefault();

    // get the href
    var href = $(this).attr("href");
    $("#content").load(href, function() {
        // do something after content has been loaded
    });
});

这篇关于如何使用jQuery进行部分页面更新?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！