Asp.net：带有 Jquery 滑块问题的中继器答案

【问题标题】：Asp.net: Repeater with Jquery slider issueAsp.net：带有 Jquery 滑块问题的中继器
【发布时间】：2017-07-13 04:00:18
【问题描述】：

我正在使用 asp:Repeater 处理 asp.net 项目，以显示来自数据库和 JQuery 的数据以进行如下转换：

<asp:Repeater ID="Repeater1" runat="server" OnItemCommand="repUsers_ItemCommand">
                        <ItemTemplate>
                            <div class=" col-md-3 col-sm-4">
                                <div class="thumbnail">
                                    <asp:Image ID="Image1" ImageUrl='<%#Eval("Imgpath") %>' hieght="100" Width="300" runat="server" />
                            <div class="caption">
                                 <h3>Product Name</h3>
                            <div class="slideDown">
                                 <h5>Student Name:</h5>
                                 <h5>Description</h5>
                                 <h5>Contact:</h5>
                            </div>
                                    <p>
                                        <asp:LinkButton ID="LinkButton1" CommandArgument='<%#Eval("Imgid")%>' CommandName="select" 
                                            Text="Select" class="btn btn-primary grabPromo" runat="server"></asp:LinkButton></a> 
                                        <a  class="btn btn-danger grabPromo" role="button">See Details</a>
                                    </p>
                            </div>
                       </div>
                 </div>
          </ItemTemplate>
 </asp:Repeater>

用于幻灯片的 Jquery

 $('.grabPromo').click(function (e) {
                $('.slideDown').slideToggle();
            });

现在的问题是，如果单击一个 div 的“查看详细信息”按钮，它将向下滑动以查看转发器中的所有内容。我想一次只为一个 div 和一个转发器内容滑动它。那有可能吗？如果是这样，请指导我完成。 all the details are shown on click of one repeater content

【问题讨论】：

标签： jquery html css asp.net twitter-bootstrap

【解决方案1】：

你需要改变这一行：

$('.slideDown').slideToggle();

到：

$(this).closest('div.caption').find('.slideDown').slideToggle();

说明：获取最近的div.caption元素，然后找到对应的slideDown子元素。

相反，$('.slideDown') 会查找具有该类的每个元素。

jQuery.closest():

对于集合中的每个元素，通过测试元素本身并向上遍历其在 DOM 树中的祖先来获取与选择器匹配的第一个元素。

【讨论】：