Jquery 切换转发器中的单个项目
Jquery toggle individual item in repeater
希望这个问题是可以理解的。
我有一个中继器,有几行来自数据库,每一行都有一张图片和一个按钮
像这样:
<asp:Repeater runat="server" DataSourceID="SqlDataSource1" ID="repeater1">
<ItemTemplate>
<div class="col-lg-2 col-md-2 col-sm-4 col-xs-6" style="height: 200px;">
<div class="thumbnail text-center sletbox">
<img class="img-responsive" src='../fotos/<%# Eval("url") %>' alt=""></a>
<div class="slet">
<a href='delete_picture.aspx?id=<%# Eval("pic_id") %>&a=<%# Eval("album") %>&n=<%# Eval("url") %>' onclick="return confirm('Vil du slette dette billed?')">
<h3 class="btn btn-danger btn-xs" id="contact">Slet</h3>
</a>
</div>
</div>
</div>
<!-- col-lg-4 -->
</ItemTemplate>
</asp:Repeater>
然后我做了一个 jquery 函数,使按钮在悬停时出现,效果很好。
<script>
$(document).ready(function () {
$(".slet").hide();
$(".sletbox").hover(function () {
$(".slet").fadeToggle(50);
});
});
</script>
但问题是它会显示所有按钮,而不仅仅是您悬停的按钮。
那我怎么才能让你悬停的那个出现呢?
尝试使用以下代码:
$(document).ready(function () {
$(".slet").hide();
$(".sletbox").hover(function () {
$(this).find(".slet").fadeToggle(50); //locating the associated .slet and not the all one.
});
});
希望这个问题是可以理解的。
我有一个中继器,有几行来自数据库,每一行都有一张图片和一个按钮
像这样:
<asp:Repeater runat="server" DataSourceID="SqlDataSource1" ID="repeater1">
<ItemTemplate>
<div class="col-lg-2 col-md-2 col-sm-4 col-xs-6" style="height: 200px;">
<div class="thumbnail text-center sletbox">
<img class="img-responsive" src='../fotos/<%# Eval("url") %>' alt=""></a>
<div class="slet">
<a href='delete_picture.aspx?id=<%# Eval("pic_id") %>&a=<%# Eval("album") %>&n=<%# Eval("url") %>' onclick="return confirm('Vil du slette dette billed?')">
<h3 class="btn btn-danger btn-xs" id="contact">Slet</h3>
</a>
</div>
</div>
</div>
<!-- col-lg-4 -->
</ItemTemplate>
</asp:Repeater>
然后我做了一个 jquery 函数,使按钮在悬停时出现,效果很好。
<script>
$(document).ready(function () {
$(".slet").hide();
$(".sletbox").hover(function () {
$(".slet").fadeToggle(50);
});
});
</script>
但问题是它会显示所有按钮,而不仅仅是您悬停的按钮。
那我怎么才能让你悬停的那个出现呢?
尝试使用以下代码:
$(document).ready(function () {
$(".slet").hide();
$(".sletbox").hover(function () {
$(this).find(".slet").fadeToggle(50); //locating the associated .slet and not the all one.
});
});