如何在使用 jQuery.load 时获取和更改 url

How to get and change url when using jQuery.load

本文关键字：获取 url load jQuery      更新时间：2023-09-26

我想根据菜单页面更改网址，以便轻松地将链接共享给其他人，因为每个页面都有自己的网址名称。

因此，我有一个加载文件内容的函数。但是如何将 url 更改为函数来实现它呢？

<script>
    function getfile(data) {
        var file= data+'.html';
        $('#content').load(file);
    }
</script>

这是使用onclick功能的导航。

<ul>
    <li><a href="#" onclick="getfile('profile')">Profile</a> </li>
    <li><a href="#" onclick="getfile('about')">About</a> </li>
    <li><a href="#" onclick="getfile('contact')">Contact</a> </li>    
</ul>

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

您可以使用历史记录 API。pushState方法将允许您更改当前页面的 URL，而无需重新加载内容。

例：

<script>
    function getfile(data) {
        var file= data+'.html';
        $('#content').load(file);
        history.pushState(null, null, file);
    }
</script>

您可能还对popstate事件感兴趣，以检测浏览器何时返回前一页。

更新：

为了加载子目录的文件，您需要知道站点根目录的路径。如果站点位于根目录中，则如下所示的内容将起作用。

<script>
    var rootPath = '/';
    function getfile(data) {
        var file= rootPath+data+'.html';
        $('#content').load(file);
        history.pushState(null, null, file);
    }
</script>
相关文章：