当我点击链接时如何在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();
});

Answer 2

试试这个

$("a").click(function(){

   $(this.href).show();

   return false;

});

Answer 3

首先添加一个类来标识需要此功能的锚标记，例如。 'visibility_toggle'。然后添加一个使用href属性的处理程序来计算显示/隐藏的div。

$('a.visibility_toggle').click(function(e) {
    $(this.href).toggle();
    e.preventDefault();
});