javascript - 将内容加载到从中加载内容的 DIV 标记中

Question

我有一个带有左侧面板和右侧内容 div 的网站。当我单击左侧面板中的任何链接时，我使用 Javascript Ajax 调用将内容加载到 div 标记（名为“内容”）中。

在我的情况下，加载到 div 标签中的视图也有链接，所以通常如果我点击它们，它们只会打开一个全新的页面。我希望它们也加载到调用它们的同一个 div 标签中。

我怎样才能做到这一点？

Answer 1

如果您要在同一页面上打开新链接，那么您可以使用以下内容

$( "#target" ).click(function() {
var newurl="http://" + window.location["host"];
    window.location.href = newurl; // or simply window.location
})});

Answer 2

假设您有一个 #left 和一个 #content 窗格，您可以执行以下操作：

$(document).on('click', '#left a, #content a', function()
{
   var href = $(this).attr('href');
   if(!href || href[0] != '/') return; // relative URLs only

   // Do your AJAX call here
});

通过使用这种 jquery 语法，您可以将文档和过滤器绑定到#left a，#content a即使将新锚点添加到 #left 或 #content div，它们仍将连接到该单击处理程序。此时，您定义逻辑以告诉它以 AJAX 调用的形式加载新内容，而不是转到新页面。我提供了演示逻辑来帮助您入门。