0

Assuming this sort of structure:

<li class="page-title">Global</li>
<ul>
    <li class="element">Design Elements</li>
    <li class="page-title">Alerts</li>
    <ul>
        <li class="element">Alert 1</li>
        <li class="element active">Alert 2</li>
        <li class="element">Alert 3</li>
        <li class="element">Alert 4</li>
        <li class="element">Alert 5</li>
    </ul>
</ul>
<li class="page-title">Accounts</li>
<ul>
    <li class="element">Accounts Main</li>
</ul>

How can I step through the .element elements regardless of the nesting structure?

Currently, I'm using .next('.element'), but at the top or bottom of the set of elements, it starts to return nulls.

I'd like to avoid using some sort of "if this is the last in the set, set up a level and get back in" logic if possible.

EDIT: I should clarify, I'm looking to step up and down a list of these having bound the up and down keys, so I need to be able to select the actual relative next element for whatever's got .active.

So, assuming we're on Alert 2, a function I've left out runs based on a data-job attribute. We hit the up key, it steps to Alert 1, runs that function again. I'd like to be able to hit the up key again, and it pops up to 'Design Elements'.

4

2 回答 2

3

然后使用常规选择器，而不是next().

$('.element').each(function() {
      alert($(this).text());
})
于 2013-08-19T17:16:11.193 回答
0

我能够自己弄清楚！

我还包括用于观看向上和向下键的位。

$(window).keyup(function(e){

    if (e.keyCode == 40){
        var next_element = $('.active').next('li.element');

        if($('.active').is('li:last-of-type' || 'li:only-of-type')){

            next_element = $('.active').parent().nextAll().eq(1).children('.element:first-of-type');
        }   
            elementExpand(next_element);
                }

    if (e.keyCode == 38){
        var prev_element = $('.active').prev('li.element');

        if($('.active').is('li:first-of-type' || 'li:only-of-type')){
            prev_element = $('.active').parent().prevAll().eq(1).children('.element:last-of-type');

        }
            elementExpand(prev_element);


    }
})

它不是最时尚的，但它确实有效。

于 2013-08-19T18:59:42.647 回答