bootstrap 弹出框ui

最新推荐文章于 2022-12-05 21:48:30 发布

lodam的技术库

最新推荐文章于 2022-12-05 21:48:30 发布

阅读量452

点赞数 1

分类专栏： bootstrap js

本文链接：https://blog.csdn.net/qq_35699502/article/details/72473276

版权

js 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

bootstrap

1 篇文章 0 订阅

订阅专栏

          //绑定弹出框
          $(".words").each(function(){
            var self=this;
            $(self).popover({
                placement:"left",
                html:true,
                content:'<p class="showMore" >' +        $(self).parent().prev().attr('data-messageValue') + '</p>'
            });
            $(self).on('show.bs.popover', function () {
                        destroyPopover();
            });
            //绑定
            $(self).on('shown.bs.popover', function () {
                $('body').click(function (event) {
                    var target = $(event.target);
                    if (!target.hasClass('showMore') ) {
                        destroyPopover();
                    }
                });
            });
        });
        //销毁弹出框
        function destroyPopover(){
            if($(".showMore").length !== 0){
                $(".words").popover('hide');
                $(".popover-content").children().detach();
            }
        }