Пользовательское событие для выпадающего списка 5 верхних баров

Я использую верхнюю панель Foundation 5 в веб-приложении Aurelia. Я хочу добавить обработчик события клика к выпадающим пунктам меню. Мой код выглядит следующим образом:Пользовательское событие для выпадающего списка 5 верхних баров

<!DOCTYPE html> 
<html class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch g… webworkers applicationcache svg inlinesvg smil svgclippaths" style=""> 

<head> 
    <meta charset="utf-8"></meta> 
    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta> 
    <title></title> 
    <script src="/Scripts/jquery-2.1.4.js"></script> 
    <link rel="stylesheet" href="/Content/foundation/foundation.css"></link> 
    <link rel="stylesheet" href="/Content/foundation/foundation.mvc.css"></link> 
    <link rel="stylesheet" href="/Content/font-awesome.min.css"></link> 
    <link rel="stylesheet" href="/Content/custom/app.css"></link> 
    <script src="/Scripts/modernizr-2.8.3.js"></script>   
</head> 
<body> 
    <nav class="top-bar fixed" data-topbar role="navigation"> 
     ... 

     <section class="top-bar-section"> 
      <ul class="left"> 
       <li class="has-dropdown"> 
        <a href="#" title="${activeModule.Description}"> 
         ${activeModule.DisplayName} 
        </a> 
        <ul class="dropdown"> 
         <ul repeat.for="module of allModules"> 
          <li> 
           <a click.delegate="$parent.setActiveModule(module.Name)" data-trash="${$parent.activeModule.Name}"> 
            <strong>${module.DisplayName} </strong> | <em> ${module.Description} </em> 
           </a> 
          </li> 
          <li class="divider"> 
          </li> 
         </ul> 
        </ul> 
       </li> 
      </ul> 

     </section> 
    </nav> 
    <div class="page-host row"> 
    ... 
    </div> 
    <hr /> 
    <footer> 
     <p></p> 
    </footer> 

    <script src="/Scripts/foundation/fastclick.js"></script> 
    <script src="/Scripts/foundation/foundation.js"></script> 
    <script src="/Scripts/foundation/foundation.abide.js"></script> 
    <script src="/Scripts/foundation/foundation.accordion.js"></script> 
    <script src="/Scripts/foundation/foundation.alert.js"></script> 
    <script src="/Scripts/foundation/foundation.clearing.js"></script> 
    <script src="/Scripts/foundation/foundation.dropdown.js"></script> 
    <script src="/Scripts/foundation/foundation.equalizer.js"></script> 
    <script src="/Scripts/foundation/foundation.interchange.js"></script> 
    <script src="/Scripts/foundation/foundation.joyride.js"></script> 
    <script src="/Scripts/foundation/foundation.magellan.js"></script> 
    <script src="/Scripts/foundation/foundation.offcanvas.js"></script> 
    <script src="/Scripts/foundation/foundation.orbit.js"></script> 
    <script src="/Scripts/foundation/foundation.reveal.js"></script> 
    <script src="/Scripts/foundation/foundation.slider.js"></script> 
    <script src="/Scripts/foundation/foundation.tab.js"></script> 
    <script src="/Scripts/foundation/foundation.tooltip.js"></script> 
    <script src="/Scripts/foundation/foundation.topbar.js"></script> 
    <script> 
     $(document).foundation(); 
    </script> 

</body> 
</html>

Однако всякий раз, когда я нажав на выпадающий пункт обработчик события обычай не вызывается. Я проверил один и тот же код, разместив его за пределами <li class="has-dropdown"> и непосредственно под <ul class="left">, и я нашел, что он работает.

Может кто-нибудь, пожалуйста, дайте мне знать, что мне здесь не хватает?

Спасибо.

источник

2015-07-28 Sayan Pal

Для тех, кто смотрит на этот вопрос, вот как я ее решил:

я понял, что призыв к $(document).foundation(); не работает должным образом. Поскольку я использую Aurelia, я использовал жизненные циклы мнений для решения этой проблемы. Таким образом, я добавил вызов $(document).foundation(); в attached случае, как показано ниже:

attached() { 
    $(document).foundation(); 
}

И это все. Надеюсь, поможет.

источник

2015-12-09 14:10:42

Пользовательское событие для выпадающего списка 5 верхних баров

ответ

Смежные вопросы