向下滑动查看常见问题

Toggle slide down for faqs

本文关键字：常见问题      更新时间：2023-09-26

我试图在博客上建立一个常见问题页面，并努力获得正确的代码。这就是我要做的> http://jsfiddle.net/qwL33/

实际上一切都很好，但是当点击第一部分(假设这是问题1)时，它打开了两个部分(意味着两个问题)。帮助。

代码如下:

    $('#slidetoggle')
      .on('click', function(e) {
        jQuery('.slider').toggle('slideDown');
      });
<div id="slidetoggle">HELLO 1</div>
<div class="slider" style="display: none">Hello there!</div>
<div id="slidetoggle">HELLO 2</div>
<div class="slider" style="display: none">Hello there!</div>

到目前为止，这不是最好的选择，但你的问题是，你正在复制相同的ID (slidetoggle)，我再次添加了相同的功能，并替换了添加2的ID，你可以看到它在这个提琴https://jsfiddle.net/sw5ohfqv/最好的方法是创建一个函数，关闭所有的一个可见，然后打开一个点击。

   $('#slidetoggle2')
.on('click', function(e){
    var $this = $(this),
        $slider = $('.slider'),
        isOpened = $slider.is(':visible');
    if (isOpened)
    {
        $slider.slideUp();
        $this.text('show fields');
    }
    else
    {
        $slider.slideDown();
        $this.text('hide fields');
    }
});
相关文章：