应用早期选择器后应用选择器

时间:2013-11-03 19:52:51

标签: jquery jquery-selectors

我在页面上有.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>

1 个答案:

答案 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