Question

有人可以告诉我如何只获得下一个元素

就像点击第一个按钮时一样，我只想要第一个消息显示

<div>
    <span class="button">Button</span>
    <span class="message" style="display:none;">first button clicked</span>


    <span class="button">Button</span>
    <span class="message" style="display:none;">second button clicked</span>


    <span class="button">Button</span>
    <span class="message" style="display:none;">third button clicked</span>

</div>

这是我到目前为止的jquery

<script>
$(this).next().fadeIn();
setTimeout(function(){$(this).next().fadeOut();}, 3000);
</script>

Answer 1

试试这个：

$(".button").click(function(){
    $(this).next().fadeIn().delay(3000).fadeOut();
});

<强> DEMO

Answer 2

对于您的示例，next()就足够了。它抓住了对下一个DOM元素的引用

所以你要设置一个像这样的点击处理程序

$("button").click(function(){
    var message = $(this).next();
    //do whatever you want
}

Answer 3

您应该使用这样的点击事件：

$( ".button" ).click(function() {
  $(this).next().fadeIn();
  setTimeout(function(){$(this).next().fadeOut();}, 3000);
});

Answer 4

像下面这样编写你的脚本

$('.button').click(function(){
    var el = $(this);
    el.next().fadeIn();
    setTimeout(function(){
        el.next().fadeOut();
    }, 3000);
})

DEMO

得到下一个兄弟元素

4 个答案: