w2toolbar.menuClick

menuClick(id, menu_index, [event])

メニューからアイテムをクリックした時に呼び出されます。 戻り値はundefinedです。

event: object

DOMイベント。

説明

このメソッドはmenuタイプの場合のみ動作します。 ユーザーがメニューのアイテムを選択すると呼び出されます。 内部的に使用されますが、クリックをエミュレートするために使うことも可能です。 このメソッドは.onMenuClick^*1イベントを発生させます。

*1 公式サイトにもドキュメントがありません。

ツールバーが以下のように定義されている場合、

$('#toolbar').w2toolbar({
    name  : 'toolbar',
    items : [
        { type: 'check', id: 'item1', text: 'Check', img: 'icon-page', checked: false },
        { type: 'menu',  id: 'item2',  group: '1', text: 'Menu', img: 'icon-add',
            items: ['item1', 'item2', 'item3', 'item4']
        }
    ]
});

以下のように指定します。

var tb = w2ui['toolbar'];
tb.menuClick({ name: tb.name, item: tb.get('item2'), subItem: tb.get('item2:item1'),
    originalEvent: {} });

デモ

ボタンをクリックすると、'menu-item1'がクリックされたことを表示します。

JavaScript

$('#toolbar').w2toolbar({
  name  : 'mytoolbar',
  items : [
    { type: 'menu',  id: 'item1',  group: '1', text: 'menu', img: 'icon-add',
      items: [
        { id: 'menu-item1'},
        { id: 'menu-item2'},
        { id: 'menu-item3'},
        { id: 'menu-item4'}
      ]
    }
  ],
  onClick: function(event) {
    document.getElementById('result').innerHTML = event.target + 'がクリックされました。';
  }
});

$('#get-result').on('click', function(){
  var tb = w2ui['mytoolbar'];
  tb.menuClick({ item: tb.get('item1'), subItem: tb.get('item1:menu-item1') });
});

HTML

<button id="get-result">実行</button>
<div>
  <span id="result"></span>
</div>
<div id="toolbar"></div>