Question

我创建了Angularjs指令，用于将触发器连接到弹出窗口。一切都有效，除非我想在弹出窗口添加延迟节目。我是javascript和angular js的新手。所以任何帮助都将不胜感激。

.directive('businessCardPopup', function() {
    return {
        restrict: "A",
        link: function(scope, pop, attrs){
            scope.label = attrs.popoverLabel;

            $(pop).popover({
                trigger: "manual" ,
                container: 'body',
                template: '<div class="popover" role="tooltip" style="width: 400px;">' +
                '<div class="arrow"></div>' +
                '<h3 class="popover-title"></h3>' +
                '<div class="popover-content">' +
                '<div class="data-content"></div>' +
                '</div></div>',
                html: true,
                animation:false,
                content: '<div class="col-lg-4"></div>' +
                '<div class="col-lg-8"><p>Name</p>' +
                '<p>Position</p>' +
                '<p>Telephone</p>' +
                '<p>Email</p>' +
                '<p>Skype | Twitter | LinkedIn</p>' +
                '<p>Conversation | View Profile | Follow</p></div> ',
                placement: 'top',
                delay: {"show": 2000}
            })
                .on("mouseenter", function () {
                    var _this = this;
                    $(this).popover("show");
                    $(".popover").on("mouseleave", function () {
                        $(_this).popover('hide');
                    });
                }).on("mouseleave", function () {
                    var _this = this;
                    setTimeout(function () {
                        if (!$(".popover:hover").length) {
                            $(_this).popover("hide");
                        }

                    }, 500);
                })


        }
    }
}

）

Answer 1

我认为它应该是show: "600"而不是"show": 600

Answer 2

您的触发类型为manual，delay不适用于触发类型手册。

请参阅文档：http://getbootstrap.com/javascript/#popovers-usage

您可以尝试trigger: 'focus'。

mouseenter上的Popover延迟显示（Angularjs）

2 个答案: