Question

我有很多片段，其中包含＃34;阅读更多＆＃34;链接，我正在寻找一种方法来为所有片段设置相同的选择器。我认为jQuery的下一个可以工作：

<script>
$(document).ready(function () {
    $(".readmore").click(function () {
        $(".readmore").next().slideToggle("slow", function () {
            $(window).scrollTop($(this).offset().top);
        });
    });
});
</script>

Visible text 1<a class="readmore">Read More 1</a><div class="more">Text to appear 1</div>
Visible text 2<a class="readmore">Read More 2</a><div class="more">Text to appear 2</div>
Visible text 3<a class="readmore">Read More 3</a><div class="more">Text to appear 3</div>

<style>.more {display:none}</style>

不幸的是，当点击一个＆＃34时，会显示所有片段的文字;阅读更多＆＃34;链接，而不仅仅是下一个元素。上面的代码出了什么问题？

这里是JsFiddle。

Answer 1

你应该改变

$(".readmore").click(function () {
    $(".readmore").next()...

到

$(".readmore").click(function () {
    $(this).next()...

因此next()事件函数中的click()选择器仅应用于当前单击的元素，而不是同时应用于类readmore的所有元素。

Slidetoggle下一个元素

1 个答案: