如何將jQuery應用於多個類項目的子項？

Question

我有一個類叫做.bxSlider

我想將這個jQuery應用於所有的.bxSlider分隔框。不過，我想將一些jQuery應用於單個框。

$(document).ready(function(){ 
    // LOAD ITEM SLIDER 
    $('.bxslider').bxSlider({ 
     pager:false  
    }); 
    // BLACK IMAGE HOVERS 
    $(".bxslider").hover(function() { 
     $(this)(".bx-wrapper .bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)"); 
     $(this)(".bx-wrapper .bx-next").css("background-image", "url(//www.cdn.com/running/right_arrow_off.png)"); 
    }, function() { 
     $(this)(".bx-wrapper .bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_on.png)"); 
     $(this)(".bx-wrapper .bx-next").css("background-image", "url(//www.cdn.com/running/right_arrow_on.png)"); 
    }); 
}); 

HTML代碼，所以你可以看到我如何使用多個框。

<div class="items"> 
    <div class="bxslider bx-wrapper"> 
     Hello <a class="bx-prev" href=""></a> 
     Goodbye <a class="bx-next" href=""></a> 
    </div> 
    <div class="bxslider bx-wrapper"> 
     Hello <a class="bx-prev" href=""></a> 
     Goodbye <a class="bx-next" href=""></a> 
    </div> 
</div> 

我使用this但我無法得到它的工作

Answer 1

假設.bx，prev是上.bxSlider即孩子：

<div class="bxSlider bx-wrapper"> 
    <div class="bx-prev"></div> 
</div> 

。

$(this).find(".bx-prev").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)"); 

如果你想定位.bx滑塊的父母，那麼你可以這樣做：

$(this).closest("#desiredParentId").css("background-image", "url(//www.cdn.com/running/left_arrow_off.png)")