javascript - 单击链接时如何在 jQuery 中显示具有自己 id 的特定 div？

Question

我有一个像这样的 div:

<article id="#pippo">blablabla</article>

我已经用 jQuery 隐藏了

$('article').hide();

现在我想要一个链接菜单，例如在单击时显示特定的文章 ID。

如果我点击链接:

<a href="#pippo"> LINK PIPPO </a>

我希望显示名为#pippo 的文章

如果我点击指向#pluto 的链接，则必须显示 ID 为#pluto 的文章...

我如何在 jQuery 中执行此操作？

Answer 1

如果您希望它适用于每个 <a>在您的页面上添加标签，然后您可以执行以下操作

$('a').click(function (e) {
  var id = $(this).attr('href');
  $(id).show();

  // Don't follow the link
  e.preventDefault();
});

虽然您希望它在 <a> 的子集上工作，但更有可能在页面上。如果是这样，您可以通过在链接中放置一个类并根据需要更改您的选择器来区分它们

HTML:

<a href="#pippo" class="fakeLink"> LINK PIPPO </a>

JavaScript:

$('a.fakeLink').click(function (e) {
  var id = $(this).attr('href');
  $(id).show();

  // Don't follow the link
  e.preventDefault();
});