Jquery Ajax加载除某个div之外的整个页面

Posted 2023-04-14

【中文标题】Jquery Ajax加载除某个div之外的整个页面

【英文标题】：Jquery Ajax loading the whole page except a certain div

【发布时间】：2012-12-08 16:36:28

【问题描述】：

我正在编写一个在页脚有音频播放器的应用程序。每次我点击一个链接时，整个页面本身都会加载，因此音频播放器正在重新启动，我的问题是如何重新加载除某个 div 之外的整个页面？

【参考方案1】：

我认为这是不可能的。也许改变你的方法。仅重新加载要刷新的特定区域。事实上，这些区域可能包含在单个（并且可能很大）div 标签中。然后，您可以使用 jQuery ajax 更新该 div。为此，load 是要走的路：

$('#result').load('ajax/test.html', function() 
  alert('Load was performed.');
);

编辑：

这是一个使用链接的更具体的例子（我只是把它写下来）：

<script type="text/javascript">
   $(function()
      $("#myLink").click(function(event)
        $("#updateThisDiv").load($this.attr('href'), function()
          alert('div updated!');
        );             
        return false; // or event.preventDefault();
      );
    );
</script>

您的链接将如下所示：

<a href='pathTo/Page' id='myLink'>Link text</a>

...

<div id="updateThisDiv"></div>

【讨论】：

如果我这样做了，URL 会改变吗？因为这就是我想要发生的事情。

@user962206 url不会改变，虽然你可以改变hash（见下面的链接），只是好奇，为什么你需要改变url？：***.com/questions/6478485/…

假设我在索引页面中。 www.myapp.com，然后假设我单击了一个名为“事件”的链接，我希望该页面被加载 ajaxified。所以在我的链接中会出现这样的东西。 www.myapp.com/events 也，我还想添加 URL 参数。 www.myapp.com/events?eventId=1 或类似的东西。并且还允许添加书签

有没有办法在页面上添加哈希？

有什么用？您是否有机会查看我在之前评论中添加链接的问题？

【参考方案2】：

所以你正在使用 jQuery ajax。即使您通过 ajax 重新加载整个 div，音频对象也保持不变。因此，您可以在对象的帮助下再次生成音频进度。

编辑： 如果您要重新加载页面，只是建议。 首先使用 ajax 将音频对象的 currentTime 保存在会话甚至数据库中。当用户加载该音频时，从 currentTime 开始。 你可以这样做：

 yourAudioObject.addEventListener(
                    'timeupdate',
                    function() 
                     $.ajax (
            type:'get',
            url:'your/path/?currenttime='+yourAudioObject.currentTime, 
            ......