0

jQuery Fancytree を使用して、Web ページ ナビゲーション用のツリー ビューを作成しています。AlloyUI のツリー ビューはとても気に入っていますが、右クリック オプションがないようです。右クリックドロップダウンメニューオプションを持つJavaScript/HTMLベースのツリービューライブラリを知っている人はいますか?

4

1 に答える 1

0

AlloyUI でカスタムの右クリック コンテキスト メニューをTreeView使用する場合は、YUI のevent-contextmenuモジュールを使用する必要があります。

「The contextmenu Event Fix」の例に若干の変更を加えることで、AlloyUI で機能させることができますTreeView。

<div id="treeView" />
<div id="contextMenu" />
<script>
     YUI().use('aui-tree-view', 'event-contextmenu', 'overlay', function (Y) {

        var treeView = new Y.TreeView({
            // ... your TreeView code here
        }).render();

        var contextMenu = new Y.Overlay({
            boundingBox: '#contextMenu',
            bodyContent: "<span class=\"context-menu\">Context Menu</span>",
            visible: false,
            constrain: true
        }).render();

        contextMenu.on('click', function (event) {
            contextMenu.hide();
        });

        treeView.get('boundingBox').on('contextmenu', function (event) {    
            contextMenu.set("xy", [event.pageX, event.pageY]);
            contextMenu.show();
        });
    });
</script>

このコードと AlloyUIサンプル コードを使用したJSFiddleを次に示します。TreeView

于 2014-09-10T14:36:35.043 に答える