javascript - jquery load() 特定 div 不起作用

Question

以下是相关 HTML 部分以及与之相关的 Javascript:

HTML优先:

<div id="menu">
<ul>
<li><a href="content.html#diviwant">click</a></li>
</ul>
</div>

Javascript 是这样的:

$("#menu a").click(function(){
var link=encodeURI($(this).attr("href"));
$("#divtobeloadedwith").load(link);
return false;
});

content.html结构:

<div id="wrapper">
<div id="diviwant">stuff</div>
<div id="dividontwant">stuff</div>
</div>

点击链接后，它会加载所有内容，而不是仅加载特定的 div。

Answer 1

从根本上来说，问题是你想要两种不同的东西:

1. 在没有 Javascript 的情况下运行时，您需要使用链接 content.html#diviwant，因为它将加载页面 content.html，然后跳转到ID 为 diviwant 的元素。

2. 使用 Javascript 运行时，您希望将 content.html #diviwant 传递给 jQuery 的 load() 方法，因为这告诉 jQuery 仅加载片段目标页面的 id diviwant。

我可能会使用 content.html#diviwant 作为链接，如您所知，然后在 jQuery 中解释它，如下所示:

$("#divtobeloadedwith").load(link.replace('#', ' #'));

...为 load() 添加必要的空间。