Question

我想隐藏链接被点击的div，然后显示结果div代替艺术家div

<div class="artist">
  <a href="#" class="artist-link">click</a>
</div>
<div class="results"></div>

<div class="artist">
  <a href="#" class="artist-link">click</a>
</div>
<div class="results"></div>

<div class="artist">
  <a href="#" class="artist-link">click</a>
</div>
<div class="results"></div>

点击链接后，它会隐藏点击链接的.artist div，然后显示其各自的结果div。

Answer 1

你可以这样做http://jsfiddle.net/aGV7B/1/：

$('a').click(function(){
    $(this).closest('div').hide().next().show();
});

Answer 2

试试这个：

$('a').click(function() {
    var $parent = $(this).parent();
    $parent.hide().next().show();
});

Demo Link

Answer 3

您可以使用closest(selector)和next(selector)函数实现此目的。使用选择器的优点是您可以更改标记（在某种程度上），而不会使您的JavaScript代码无效。

$('.artist').click(function () {
    $(this).next('.results').fadeIn('fast').end().closest('.artist').fadeOut('fast');
})

Answer 4

只需使用jQuery。

$('.artist-link').click( function(){
    $(this).parent().hide();
    $(this).parent().next().show();
} )

更多信息： http://api.jquery.com/

隐藏div点击链接

4 个答案: