0

我的 HTML 结构是这样的：

    <div class="product-slider-title">
        <div><span class="left">&nbsp;</span></div>
        <div>Sample title</div>
        <div><span class="right">&nbsp;</span></div>
    </div>
    <div id="prslider1" class="product-slider-wrapper">
        <div class="left-prduct-slider-nav sprites"></div>
        <div class="right-prduct-slider-nav sprites"></div>    
        <div class="product-slider">
            <ul>
                <li class="product-holder"></li>
            </ul>
        </div>
     </div>

当我点击时如何找到最接近.product-slider ul的？.left-prduct-slider-nav.left-prduct-slider-nav

4

7 回答 7

3

如果this是.left-prduct-slider-nav那么

var ul = $(this).siblings('.product-slider').find('ul')

演示：小提琴

于 2013-07-10T12:53:31.627 回答
3

您可以使用nextAll()搜索当前元素之后的兄弟姐妹，并使用find()搜索返回的匹配元素中的子元素nextAll。

现场演示

$(this).nextAll('.product-slider').find('ul');
于 2013-07-10T12:54:40.267 回答
0

这应该工作

var ul = $('.left-prduct-slider-nav').closest('ul');
于 2013-07-10T12:55:08.310 回答
0

嗯试试这个：

$('.left-prduct-slider-nav').click(function () {
    var closest_ul = $(this).parent().find('.product-holder ul');
});
于 2013-07-10T12:55:19.383 回答
0

尝试first-child：

HTML：

<div class="product-slider-title">
    <div><span class="left">&nbsp;</span>

    </div>
    <div>Sample title</div>
    <div><span class="right">&nbsp;</span>

    </div>
</div>
<div id="prslider1" class="product-slider-wrapper">
    <div class="left-prduct-slider-nav sprites">Left Slider Nav</div>
    <div class="right-prduct-slider-nav sprites"></div>
    <div class="product-slider">
        <ul>
            <li class="product-holder1"></li>
        </ul>
        <ul>
            <li class="product-holder"></li>
        </ul>
        <ul>
            <li class="product-holder"></li>
        </ul>
        <ul>
            <li class="product-holder"></li>
        </ul>
    </div>
</div>
<div class="product-slider-title">
    <div><span class="left">&nbsp;</span>

    </div>
    <div>Sample title</div>
    <div><span class="right">&nbsp;</span>

    </div>
</div>
<div id="prslider1" class="product-slider-wrapper">
    <div class="left-prduct-slider-nav sprites"></div>
    <div class="right-prduct-slider-nav sprites"></div>
    <div class="product-slider">
        <ul>
            <li class="product-holder"></li>
        </ul>
    </div>
</div>

JS：

$(document).ready(function () {
    $(".left-prduct-slider-nav").click(function () {
        alert($(".product-slider").find("ul:first-child").find("li").prop("class"));
    });
});

js小提琴。

解释：

我处理的.click()功能.left-prduct-slider-nav然后我提醒class最接近的或换句话说第一个ul:first-child的 li。

证明：

证据是我改变了class第一个ul的li，然后alert()是它，然后我得到的输出是这样的product-holder1：

于 2013-07-10T12:55:56.527 回答
0

最接近.product-slider ul的.left-prduct-slider-nav只是列表中的第一个，因此您可以使用:first：

$('.left-prduct-slider-nav').click(function() {

    $(this).parent().find('.product-slider ul:first')

})
于 2013-07-10T13:03:15.523 回答
-1

试试这个： 

$(this).next().next().find('ul');
于 2013-07-10T13:01:06.727 回答