2

我对代码的期望是:单击按钮时,指针位置会出现一个选项菜单。任何后续单击,无论是在菜单项上还是在浏览器中的其他位置,都应该关闭菜单。单击菜单项会关闭菜单,但不会单击其他任何位置。当我取消注释时$(document.body).one('click', function() {menu.remove()},菜单从未出现在首位,我怀疑我以某种方式对其进行了安排,以便单击以显示菜单实际上也关闭了菜单。这是代码:

render : function() {
            this.$el.html(this.template(this.model.toJSON()));
            var that = this;
            if (this.model.attributes.memberType != 'OWNER') {

                this.$('.memberTypeSelector').button({
                    icons : {
                        secondary : "ui-icon-triangle-1-s"
                    }
                }).click(function(event) {
                    that.showPermissions(that.model, event, that);
                });
            ...
},

showPermissions : function(member, event, view) {
            var levels = ['ADMIN', 'CONTRIBUTOR', 'VIEWER'];
            var menu = $('<ul>');
            $.each(levels, function() {
                if(member.attributes.memberType !== this) {
                    var item = $('<li>').appendTo(menu);
                    $('<a>').attr('href', '#').text(this).appendTo(item).click(function() {
                        menu.remove();
                        view.changePermission(member, this.text, view);
                    });
                }
            });
            menu.menu().css({
                position : 'absolute',
                left : event.clientX,
                top : event.clientY
            });
            $(document.body).append(menu);
            /*$(document.body).one('click', function() {
                menu.remove();
            });*/
        }

在此先感谢您的帮助。

4

2 回答 2

3

如果您将绑定到文档延迟 10 毫秒,这应该足以让事件传播到正文,以便它不会立即关闭菜单,然后在菜单上的下一次单击将导致正文单击处理程序触发。

setTimeout(function(){
    $(document.body).one('click', function() {menu.remove();});
},10)

你不能使用停止传播或类似的东西,因为这也会停止第二次点击菜单。

于 2013-07-18T21:55:10.047 回答
0

虽然延迟第二个事件绑定可能在 99.999% 的情况下都有效,但我不禁感到有一次唠叨“假设”,因为有些东西滞后并且不起作用。

这个问题提供了一个更令人满意的(至少对我来说)解决方案

于 2013-07-19T15:13:31.547 回答