jQuery Children vs Sibling(s),其中$(this)作为选择器父元素

时间:2012-02-04 03:52:54

标签: jquery jquery-selectors parent-child siblings

好的,我怀疑在我的页面上会有数十个这样的,所以我试图构建一个单独的函数来正确处理它们而不必反复回收代码并更改元素的ID或类名只是为了使这个工作

我的HTML看起来像:

<div class="button_select">
    <ul class="button_select_toggle">
        <li>
            <div class="button_select_text">Menu Text</div><div class="button_select_arrow">V</div>
        </li>
    </ul>
    <ul class="button_select_sub" rel="hidden">
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
        <li>Text</li>
    </ul>
</div>

我目前正在尝试做的是使用类button_select_sub专门获取UL,以便我可以获得其rel值。在某种程度上这是肯定的,如果这将是任何给定页面上的唯一一个,但是这将在任何给定页面上知道多少次。因此,我试图制作处理它们的通用功能。无论如何,我最后一次失败的尝试是:

var selectstatus = $(this).siblings('.button_select_sub').attr('rel');
alert('status: '+selectstatus);

但在警报中我得到“状态:未定义”也许我没有正确使用兄弟姐妹?也许是另一种选择。另外值得一提的是button_select_sub可能并不总是div中的最后一个UL,所以我做不到:最后一个。

我也尝试过,孩子们()。找到()..和其他几个人,我知道它可能我不能把它连在一起吧。

3 个答案:

答案 0 :(得分:5)

如果$(this)指的是div“button_select”,那么我认为您应该使用children而不是siblings

var selectstatus = $(this).children('.button_select_sub').attr('rel');
alert('status: '+selectstatus);

答案 1 :(得分:1)

如果$(this)引用.button-select,则siblings不是您应该使用的。 您应该使用childrenfind,但children().find()在这里毫无意义。 此外,如果有很多.button_select_sub,您应该使用each进行迭代并提取每个rel个值。

$('.button_select')
    .find('.button_select_sub')
    .each(function(){
        alert($(this).attr('rel'));
    });

答案 2 :(得分:0)

试试这个:

$(document).ready(function(){

    var selectstatus = "";

    $('.button_select').click(function(){

         selectstatus = $(this).children('ul.button_select_sub').attr('rel');
         alert('status: '+selectstatus);
    });

});

如果您有多个.button_select_sub,则可能需要运行每个语句,但这可能会导致弹出大量警报。