用php loop和jquery显示更多

Question

我正在使用php循环大约40个字符串。 我目前正在使用substr()仅显示前170个字符。 我正在使用jQuery隐藏字符串的其余部分并创建一个链接来显示其余部分。 这是我循环的代码：

echo "<span>" . $substring_1 . "</span><span class='dotdot'>...</span><span class='readmore'>" . $substring_2 . "</span><a href='#' class='clickmore'>Show more</a>";

这是jQuery：

$(document).ready(function() {
    $(".readmore").hide();
    $(".clickmore").click(function() {
        $(".dotdot").hide();
        $(".readmore").show();
    });
});

该代码有效，但是，我希望仅对单个字符串“显示更多”。 现在，因为我正在使用类选择器，所以当我单击“显示更多”时，它将为循环中的每个实例“显示更多”。

有没有一种方法只能针对我单击的循环实例“显示更多”？

Answer 1

您需要使用$(this)和prev()

$(document).ready(function() {
    $(".readmore").hide();
    $(".clickmore").click(function() {
        $(this).prev().prev(".dotdot").hide();      //<<<<<<<<<<<<<<<
        $(this).prev(".readmore").show();    //<<<<<<<<<<<<<<<
    });
});

 $(document).ready(function() { $(".readmore").hide(); $(".clickmore").click(function() { $(this).prev().prev(".dotdot").hide(); //<<<<<<<<<<<<<<< $(this).prev(".readmore").show(); //<<<<<<<<<<<<<<< $(this).hide(); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span>This is</span><span class='dotdot'>...</span><span class='readmore'> Complete string</span><a href='#' class='clickmore'>Show more</a> <hr /> <span>This is</span><span class='dotdot'>...</span><span class='readmore'> Complete string</span><a href='#' class='clickmore'>Show more</a> <hr /> <span>This is</span><span class='dotdot'>...</span><span class='readmore'> Complete string</span><a href='#' class='clickmore'>Show more</a>