如何在沒有提交按鈕的情況下顯示“下拉菜單”？

Question

我只想在單擊小按鈕后為元素創建和顯示菜單。

我有一個小按鈕，運行功能“ doAction”

<i class="fa fa-ellipsis-h" ng-click="doAction(\'OpenMenu\', $event)"></i>

在我的函數“ doAction”中，想要從事件鼠標單擊中獲取位置XY，並在此位置顯示我的菜單。 幾乎所有東西都可以工作...我對“下拉菜單”有疑問。 更准確地說，我看到上面描述的按鈕和此代碼中的按鈕（id = test）：

 var menu = angular.element('<div class="dropdown">' +
                '<button id="test" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown"><span class="caret"></span></button>'+
                '<ul class="dropdown-menu">'+
                '<li><a href="#">HTML</a></li>'+
                '<li><a href="#">CSS</a></li>'+
                '<li><a href="#">JavaScript</a></li>'+
                '</ul>'+
                '</div>');

            menu.css({
                position: 'absolute',
                left: event.clientX,
                top: event.clientY,
                zIndex: '999'
            });

            var body = angular.element(document).find('body').eq(0);
            body.append(menu);

現在，我必須單擊第一個按鈕“ fa-ellipsis-h”，然后單擊“測試”按鈕，然后我才能看到我的菜單。 我不知道如何在按下第一個按鈕“ fa fa-ellipsis-h”后立即從變量“菜單”中刪除按鈕“ id = test”並打開菜單。

Answer 1

首先，確定要在函數中轉義那些單引號嗎？ 我將HTML復制並粘貼到jsbin中，由於這個原因，它立即失敗了。

如果我了解您的要求，則希望您的菜單在第一次單擊后打開，而不是在單擊<i>元素后再單擊“測試”按鈕后打開。

在這里，它對我<i class="fa fa-ellipsis-h" data-ng-click="doAction('OpenMenu', $event)">Menu</i> ： 工作示例 <i class="fa fa-ellipsis-h" data-ng-click="doAction('OpenMenu', $event)">Menu</i>

單擊立即打開菜單（我為那些元素添加了一些文本，因為我沒有包含fontawesome庫）。