javascript - 如何动态加载外部页面内容

Question

动态加载页面内容的最佳方式和方式是什么？（使用 div 容器加载新内容而无需重新加载/刷新整个页面）

我有一个画廊页面，并且只想从我将来制作的其他页面中加载新的画廊内容。我将使用分页栏来加载内容。最好在地址栏中没有主题标签。我会很感激任何帮助。谢谢。

这是我正在处理的画廊页面。

http://www.hlipublishing.com/nmg/index.html

以下是我正在寻找并引起我注意的示例。

http://www.unheap.com/

从 CSS-Tricks 重新思考动态页面替换内容和文档模板。

Answer 1

尝试使用ajax：

$.ajax({
     url: url,
     data: prameters,
     dataType: "html",
     type: "post"
     success: function(result){
     //append your dynamic image here
      $("#gallery").html(result);
     }
});

在成功部分，result应该html为您的图像返回 。然后，您可以自由地将其附加到页面上的任何位置。整个过程不会重新加载您的页面或将主题标签添加到您的 URL（除非您使用<a>标签作为 ajax 的触发器）

Answer 2

$.ajax()是你的答案。基本上，你想要做的是：

1. section.portolfio编写一个脚本，只返回一页的内部数据（里面的内容）。理想情况下，您可以使用一个函数来检查调用是否来自 AJAX，并且只返回 ajax 的内部数据，或正常请求的整个页面。
2. 为您的寻呼机编写一个 .click 函数，该函数将抓取您要查看的页面#（来自 rel 标签、href 标签，几乎任何东西）
3. 在 .click 函数中调用 $.ajax() ，其中url包含脚本、data页面和success处理返回的函数（它应该以您指定的格式接受返回的数据。我猜'html'。这个函数应该清除出当前内容并用新内容重新填充该部分。

顺便说一句，您当前过滤系统的一个问题是您只过滤您所在页面的内容，这意味着即使有更多结果，您最终也可能得到不到一整页的结果。如果您扩展您的函数以也接受过滤器参数，您可以在 AJAX 请求中同时传递过滤器和页面以获得更好的用户体验。