javascriptを使用してmdl-menuをトリガする方法は？

Question

javascriptを使用してmdl-menu（Material design lite）を実行する方法を教えてもらえますか？ 私は彼のウェブサイトでそれをする方法を見つけられませんでした。

HTMLコード

<!-- Left aligned menu below button --> 
<button id="demo-menu-lower-left" 
     class="mdl-button mdl-js-button mdl-button--icon"> 
    <i class="material-icons">more_vert</i> 
</button> 

<ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" 
    for="demo-menu-lower-left"> 
    <li class="mdl-menu__item">Some Action</li> 
    <li class="mdl-menu__item mdl-menu__item--full-bleed-divider">Another Action</li> 
    <li disabled class="mdl-menu__item">Disabled Action</li> 
    <li class="mdl-menu__item">Yet Another Action</li> 
</ul> 

スクリーンショット： enter image description here

Answer 1

あなたはメニューを再初期化するには、次のコマンドを使用することができます「検索は、当社のコンポーネントタイプの要素のためのDOMを既存およびそれらがすでにアップグレードされていない場合は、それらをアップグレードします。 "

Answer 2

簡単な方法は、（this pageのJavaScriptコンソールに次のコードを試してみてください）それを 'クリック' イベントをトリガーするために次のようになります。

// the button of 3 vertical dots 
var button = document.querySelector('#demo-menu-lower-left'); 

// create a "click" event and dispatch it to button 
var ev = new Event('click'); 
button.dispatchEvent(ev); 

また、ブラウザのinspector開発ツールを使用してbuのイベントハンドラを見つけることもできますトントン、それから学ぶ。 source codeこれによると componentHandler.upgradeDom('MaterialMenu', 'mdl-menu');

：