Question

我使用Material Design Light而没有任何其他框架，如Angular或android。只是简单的旧PHP，Jquery，MDL min css和js。简单的菜单

<button id="lang-switcher" class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect">
    <i class="material-icons">language</i>
</button>
<ul id="lang-switcher-items" class="mdl-menu mdl-js-menu mdl-menu--top-left" for="lang-switcher">
    <li class="mdl-menu__item">EN English</li>
    <li class="mdl-menu__item">RU Русский</li>
    <li class="mdl-menu__item">UK Українська</li>
    <li class="mdl-menu__item">PL Polski</li>         
</ul>

菜单项单击必须运行js函数，如setLanguage(language)

如何为＆＃34; mdl-menu__item＆＃34;创建监听器？点击？我应该为每个.click(function())使用Jquery li，还是使用mdl-menu select元素的任何其他方式？

Answer 1

使用jquery的click事件并将其与类绑定。同时为li元素定义 ID ，以便您可以了解单击了哪个元素。看下面的例子

$(".mdl-menu__item").click(function(){
   var id = $(this).attr("id");
   alert(id+"was clicked");
})

演示我创建了jsfiddle

如何在Material Design Light mdl菜单中处理事件

1 个答案: