JQuery найти номер индекса вложенной ли - PullRequest
0 голосов
/ 21 октября 2011

Как мне получить индексную позицию одного из вложенных лимитов? Я могу получить индексы topnav, но не могу показывать номер индекса дочерних элементов subnav.

Я хотел бы создать селектор динамически для нацеливания на subnav на основе индекса topnav.

<div id="nav_container">
    <ul id="topnav">
        <li><a href="#a">menu item 0</a>
            <ul id="subnav0">
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
            </ul>
        </li>
        <li><a href="#a">menu item 1</a>
            <ul id="subnav1">
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
                <li><a href="#">sub menu item</a></li>
            </ul>
        </li>
        <li><a href="#">menu item 2</a></li>
        <li><a href="#">menu item 3</a></li>
     </ul>
</div>

Мой код jQuery

 //Event Handler
 function nav_execute(){
    var _index = $('#topnav > li').index(this);//Returns index number of topnav item selected
    var _subnav = '#subnav'+ _index.toString();
    var _selector = _subnav + ' > li'.toString();//the subnav selector
    var _subindex = $(_selector).index();//gets total num of index's
}

//Binded event
$('#topnav > li').bind('click', nav_execute);

Ответы [ 3 ]

0 голосов
/ 21 октября 2011

Так что я думаю, что вы пытаетесь сказать, что я хочу получить 'subNav "ul, содержащийся во всех нажатых кнопках" #topNav> li "?

Если это то, что вы пытаетесь сделать, то это должно сделатьработа

//Event Handler
 function nav_execute(){
    var $subNav = $(this).find("ul");

    //I'm not sure what you are trying to do here so im not going to change the functionality
    var subindex = $subNav.index();//gets total num of index's
}

//Binded event
$('#topnav > li').bind('click', nav_execute);

РЕДАКТИРОВАТЬ:

Для вашего комментария здесь jsfiddle из того, что вы хотите: http://jsfiddle.net/wuFB7/4/

Вы можете просто создатьСелектор для этих вложенных li напрямую. Однако, поскольку вы сказали, что они генерируются динамически, я изменил «.bind» на «.live», так как это позволит присоединять обработчики событий к элементам, созданным после начальной загрузки страницы.

0 голосов
/ 21 октября 2011
This code seems to have solved my problem. This checks the parent 'id' and then performs a simple conditional statement to determine which nav was clicked. It then stores the index(s) to their master vars.


 function nav_execute(e){

    var id = $(this).parent().attr("id").toString();

    if(id == "topnav"){
        _index = $(this).index();
        _subindex = null;
    }else{
        _index = $(this).parent().parent().index();
        _subindex = $(this).index();    
    }

    console.log('_index: ' + _index);
    console.log('_subindex: ' + _subindex);

    return false;   
}


$('#topnav > li').live('click', nav_execute);


Thanks for the help from everyone!
0 голосов
/ 21 октября 2011

С учетом того, что я действительно не уверен, что понял, к чему вы стремитесь, попробуйте заменить ваш javascript следующим текстом:

$('#topnav  li').bind('click', function (){
  alert($(this).index());   
});

См. Полный пример здесь решение. Это способ увидеть, какие элементы являются событиями запуска и в каком порядке).

...