应用较早的选择器后应用选择器 [英] Apply selector after having applied earlier selector

问题描述

我在页面上有多个带有.product1的项目.当用户将鼠标悬停在缩放按钮上时，我想获取类image的HTML. 我尝试通过:

I have multiple items with .product1 on a page. When a user hovers over a zoom button I want to get the HTML of class image. I tried via:

$(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>

推荐答案

您刚刚省略了.find().

使用:

$(document).ready(function () {
    $(".productzoom").hover(function () {//also add this function to click
        console.log( $(this).closest(".product1").find(".image").html() );        
    });
});

jsFiddle示例

jsFiddle example

这篇关于应用较早的选择器后应用选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！