我在页面上有.product1的多个项目。当用户将鼠标悬停在缩放按钮上时,我希望获得类image
的HTML。
我尝试过:
$(this).closest(".product1")(".image").html()
但这没有任何回报。
这是我的代码:
$(document).ready(function () {
$(".productzoom").hover(function () {//also add this function to click
console.log($(this).closest(".product1")(".image").html());
});
});
<div class="product1">
<div class="prodtitle">
<span itemprop="name"><asp:Literal ID="Literal11" runat="server" /></span>
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<div class="price">
<span itemprop="price"><asp:Literal ID="Literal12" runat="server" /> <asp:Literal ID="Literal13" runat="server" /> <asp:Literal ID="Literal14" runat="server" /></span>
</div>
</div>
<div class="description">
<div class="image">
<a href="http://www.bing.com?id=1"><img src="/images/logo_nl.png" style="max-width:100px" alt="Deckchairs" /> <!--thumbnail image-->
<span> <!--span contains the popup image-->
<img style="max-width:400px" src="/images/logo_nl.png" alt="Deckchairs" /> <!--popup image-->
<br />Deckchairs on Blackpool beach <!--caption appears under the popup image-->
</span>
</a>
</div>
<span itemprop="description"><asp:Literal ID="Literal15" runat="server" /></span>
</div>
<div class="stock"><asp:Literal ID="ltStockStatus" runat="server" /></div>
<div class="actionmenu">
<img src="/images/zoom.png" class="productzoom pointer" />
<a class="link viewproduct" href="#" title="">view</a>
<a class="link orderproduct" rel="nofollow" href="#" target="_blank" title="">order</a>
</div>
</div>
答案 0 :(得分:3)
您刚刚遗漏了.find()
。
使用:
$(document).ready(function () {
$(".productzoom").hover(function () {//also add this function to click
console.log( $(this).closest(".product1").find(".image").html() );
});
});
<强> jsFiddle example 强>