jquery - 相同的功能需要特定的操作

Question

我在一个循环中有几个内容 div，其中包含一个带有更多按钮的隐藏 div，单击更多按钮会显示隐藏的 div。

我遇到的问题是，当我单击“更多按钮”时，会显示每个内容 div 上的所有隐藏 div。我需要这个特定于它所在的内容 div

我正在使用的代码是：

$("a.ta-detail").click(function(){
  $(".ta-show-more").slideToggle(300, function() {
        $("a.ta-detail").text($(this).is(':visible') ? "Less" : "More");
    });
})

提前感谢您的帮助乔纳森

Answer 1

如果您有与隐藏 div 一样多的打开按钮，您可以尝试以下操作：

$("a.ta-detail").click(function(){
  var index = $(this).index();
  $(".ta-show-more").eq(index).slideToggle(300, function() {
    $("a.ta-detail").text($(this).is(':visible') ? "Less" : "More");
});
})

这只会切换等于正确索引的隐藏div

Answer 2

尝试这个：

$("a.ta-detail").click(function(){
    var $this = $(this);
    $(this).siblings(".ta-show-more").slideToggle(300, function() {
        var text = $(this).is(':visible')?"Less":"More";
        $this.text(text);
    });
})