1

http://paulkinzett.github.io/toolbarのtoolbar.js を使用したいのですが、文書化されているようにツールバーがイベントの処理を行っているにもかかわらず、どれを識別することができないようですクリックしたツールバー ボタン/アイコン。

以下は、サンプル サイトからほとんど抜粋したコード スニピットです。

私はJSの専門家ではないので、正しいアクションを実行できるようにtoolbarItemClickイベントを処理する方法について誰かが教えてくれたら、それは素晴らしいことです.

ありがとうライオネル

<div id="user-options" class="toolbar-icons" style="display: none;">
    <a href="#" target="_blank"><i class="icon-edit"></i></a>
    <a href="#" target="_blank"><i class="icon-trash"></i></a>
</div>

<div class="tooltip-container normal">';
    <section class="left">';
        <div id="normal-button" class="settings-button"><img src="/3rdparty/paulkinzett-toolbar/documentation/img/icon-cog-small.png" /></div>';
    </section>';
</div>


$('#normal-button').toolbar({content: '#user-options', position: 'top'});

$('#normal-button').on('toolbarItemClick',
            function(event) {
                console.log(event);
            }
        );
4

2 に答える 2

1 

$('#button').toolbar({
	content: '#toolbar-options',
	position: 'top',
	style: 'primary',
	event: 'click',
	hideOnClick: true
});

$('#button').on('toolbarItemClick',
   function( event,buttonClicked ) {
      alert(buttonClicked.id);
   }
);
<link href="https://paulkinzett.github.io/toolbar/css/documentation.css" rel="stylesheet"/>
<link href="https://paulkinzett.github.io/toolbar/css/jquery.toolbar.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://paulkinzett.github.io/toolbar/js/jquery.toolbar.min.js"></script>

<div id="toolbar-options" class="hidden">
   <a href="#" id="plane"><i class="fa fa-plane"></i></a>
   <a href="#" id="car"><i class="fa fa-car"></i></a>
   <a href="#" id="bycicle"><i class="fa fa-bicycle"></i></a>
</div>

<div data-toolbar="toolbar-options" data-toolbar-animation="flip" class="btn-toolbar feature-toolbar btn-toolbar-primary text-center" data-toolbar-style="primary" id="button"><i class="fa fa-cog" style="position: relative"></i></div>

于 2016-01-25T22:25:09.177 に答える