回到某个页面后会触发多个popover

Question

我的网页上有一个gridview。当悬停在某个网格div上时，弹出窗口会被触发。当我导航到另一个页面并再次返回到同一页面并将鼠标悬停在那些div上时，会创建多个弹出式窗口，从而产生非常暗的盒子幕后效果。

我尝试在单击后退按钮时删除所有弹出框，但没有用。

getPopover: function(popoverOptions) {
            popoverOptions.forEach(function(value, key) {
                if (value.content !== "") {
                    var popoverObj = new Popover({
                        trigger: value.trigger === undefined ? "click" : value.trigger,
                        target: value.name === undefined ? "" : widget.getElement('[name="' + value.name + '"]'),
                        body: value.content === undefined ? "" : value.content,
                        events: {
                            onShow: function() {
                                $($(".popover-body")[0]).css({
                                        "word-wrap":"break-word"
                                    });
                                if (value.trigger === "click" && $($(".popover-body")[0]).height() > 150) {
                                    $($(".popover-body")[0]).css({
                                        "height": "150px",
                                        "overflow-y": "scroll",
                                        "overflow-x": "hidden"
                                    });
                                    this.hide();
                                    this.show();
                                }
                            }                            
                        },
                        closeOnClick: true,
                        position: value.position === undefined ? "top" : value.position,
                        delay: value.delay === undefined ? {
                            show: 400
                        } : {
                            show: value.delay
                        }
                    });

                    //popver to be trigger on hover over .popoverPopupTrigger class objects
                    $(".popoverPopupTrigger").on("mouseenter", function() {
                        $(this).click();
                    });

                    //popover should be visible on hover over itself else hide
                    $(".popoverPopupTrigger").on("mouseleave", function(e) {
                        if(e.target.className.split(" ")[0] === ("popoverPopupTrigger")){
                            // var popoverTrigger = $(this);
                            setTimeout(function () {
                                if (!$(".popover:hover").length) {
                                    popoverObj.hide();
                                }
                            }, 300);
                        }else{
                            popoverObj.hide();
                        }
                    });  

                    //adding custom event to popover class elements
                    popoverObj.elements.body.addEvent('mouseleave', function(e){  
                        popoverObj.hide();
                    });


                    $(window.parent.document).mouseup(function(e) {
                        var menuDiv = $(".popover");
                        // if the target of the click isn't the container... nor a descendant of the container
                        if (!menuDiv.is(e.target) && menuDiv.has(e.target).length === 0) {
                            popoverObj.hide();
                        }
                    });
                    $(document).mouseup(function(e) {
                        var menuDiv = $(".popover");
                        // if the target of the click isn't the container... nor a descendant of the container
                        if (!menuDiv.is(e.target) && menuDiv.has(e.target).length === 0) {
                            popoverObj.hide();
                        }
                    });
                }
            });
        }