Раскройте Div и скрыть других в Dojo - PullRequest
Новая
       20

Раскройте Div и скрыть других в Dojo

0 голосов
/ 24 мая 2011

Привет. Я создаю некоторую пользовательскую навигацию в Dojo (Dojo Newbie) и немного борюсь с последней частью головоломки. По сути, при наведении указателя мыши на ссылку с классом navSectionTitle будет отображаться div, содержащий больше ссылок. Однако, когда это произойдет, я хотел бы скрыть все остальные div, которые в настоящее время раскрыты. Моя пометка ниже может показать то, что я пытаюсь достичь: 

<div class="navElement"> 
                    <a href="" class="navSectionTitle">Home Appliances  &#43;</a>
                    <div class="subMenuHolder">
                        <ul>
                            <li><a href="#">Washing Machines</a>,</li>
                            <li><a href="#">Vacuum Cleaners</a>,</li>
                            <li><a href="#">Microwaves</a>,</li>
                            <li><a href="#">Ovens</a>,</li>
                            <li><a href="#">Coffee Makers</a>,</li>
                            <li><a href="#">Toasters</a>,</li>
                            <li><a href="">More</a> &#43;</li>

                        </ul>
                    </div>  
                </div>

                <div class="navElement"> 
                    <a href="" class="navSectionTitle">Furniture  &#43;</a>
                    <div class="subMenuHolder last">
                        <ul>
                            <li><a href="#">Bedroom Furniture</a>,</li>
                            <li><a href="#">Kitchen Furniture</a>,</li>
                            <li><a href="#">Living Room Furniture</a>,</li>
                            <li><a href="#">Outdoor Furniture</a>,</li>
                            <li><a href="#">Office Furniture</a>,</li>
                            <li><a href="#">Book Shelves</a>,</li>
                            <li><a href="">More</a> &#43;</li>

                        </ul>
                </div>  
                </div>

Так что, когда на ссылке наведите курсор мыши на ее шкафу, будет показан div subMenuHolder, однако я бы хотел скрыть любые другие открытые элементы subMenuHolder. Ниже приведен фрагмент моего кода: 

        dojo.query(".navSectionTitle").forEach(function(node, index, nodelist){     
         dojo.connect(node , "onmouseover", function(evt){               
                 dojo.query(node).next('.subMenuHolder')[0].style.display = 'block';
              });
});

Я пробовал различные методы, но не смог достичь результатов, я ищу любую помощь, будет принята с благодарностью.

Большое спасибо

1 Ответ

0 голосов
/ 25 мая 2011

Чтобы использовать функцию next() после запроса, вам необходимо указать "dojo.NodeList-traverse": 

dojo.require("dojo.NodeList-traverse");

Вот пример того, как вы можете это сделать. 

dojo.query(".subMenuHolder").forEach(function(n) {
    var l = dojo.query(n);
    l.parent().at(0)
        .onmouseenter(function(){
            dojo.style(l[0], "display", "block");
        })
        .onmouseleave(function(){
            dojo.style(l[0], "display", "none");
        });
});

Я предполагаю, что ваши .SubMenuHolders скрыты здесь по умолчанию.

...