Jquery 再次单击时弹出窗口未关闭

我必须使用一个弹出脚本，在这个脚本中，使用变量的真值或假值切换弹出。像这样：

var iconvideoneww = true;

$('.icontrigger').click(function(){
if(iconvideoneww){
$('.iconvideopop').fadeIn(80);
}
    else{
$('.iconvideopop').fadeOut(80);    
    }
    iconvideoneww =!iconvideoneww;
});

切换也很好。问题是，我还需要一个脚本，在它之外的任何地方单击都会隐藏弹出窗口。现在，我添加了这样一个脚本，结果是弹出窗口仍然处于上述代码的“如果”步骤中，此时单击它之外的任何位置都会隐藏它，现在，如果我再次单击触发按钮打开弹出窗口，代码开始转到“其他”步骤，而我希望它转到“如果”。单击外部任何位置时隐藏弹出窗口的代码为：

$(document).mouseup(function (event) {
    var container1 = $(".tagevent-content");
    if (container1.has(event.target).length === 0) {
        container1.hide();
        toggleEventState = false;
    }
});

小提琴：

---

任何帮助都将不胜感激。谢谢

如果我是您，我将不使用popup status变量，而是根据实际元素的状态进行操作：

$('.icontrigger').click(function(){
    var $popup =  $('.iconvideopop');
    if (!$popup.is(':visible')) {
        $popup.fadeIn(80);
    } else {
        $popup.fadeOut(80);    
    }
});

我使用$popup来存储jQuery元素，只是为了避免使用选择器请求它3次。。。使用is（“：visible”）将更准确，因为它直接检查元素的状态，并确定要采取的相应操作

您也可以使用对象来完成工作，或者在显示弹出窗口时更改onmouseup事件。当弹出窗口未显示时删除它，这将是最佳步骤，但对于一个事件，实际上并不需要它

编辑：这是我心目中的目标

var toggleable = function(selector){
    return {
        $element:$(selector),
        toggle:function(){ //Decides to display or hide the element.
            if (!this.$element.is(':visible')) {
                this.show();
            } else {
                this.hide();    
            }
        },
        show:function(){ //Displays the element
             this.$element.fadeIn(80);
        },
        hide:function(){ //Hides the element
             this.$element.fadeOut(80);
        }
    };
}

var iconvideopop = toggleable('.iconvideopop');
$('.icontrigger').click(function(){iconvideopop.toggle();});
$(document).mouseup(function(){iconvideopop.hide();});

EDIT2：为了防止弹出窗口在单击时关闭（当我们在文档上进行单击时），建议执行以下操作：

function myEventHandler(event){
    if (!$(event.target).closest('.iconvideopop').length) {
        //We clicked anywhere on the document BUT on .iconvideopop or its children. We can therefor close the pop-up.
    }
}

以下是您要做的：

注册单击图像以显示弹出窗口。注册对文档的另一次单击以隐藏文档，但防止单击事件在弹出窗口中冒泡

---

感谢您的帮助，但有一个问题：单击弹出窗口中的任何位置也会隐藏它，它不应该隐藏它，或者您可以使用它。toggle（）；）不，jQuery.toggle（）使用slideDown和slideUp作为转换。。。因此，它不会完全像OP想要的那样@user3450590这是因为您正在对文档事件绑定hide函数。。。让我们看看你能做些什么。。。

$(".icontrigger").click(function (e) {
    var $popup = $(".iconvideopop");
    if (!$popup.is(":visible")) {
        $popup.fadeIn(80);
    } else {
        $popup.fadeOut(80);
    }
    e.stopPropagation();
});

$(document).click(function () {
    var $popup = $(".iconvideopop");
    if ($popup.is(":visible")) {
        $popup.fadeOut(80);
    }
});

$(".iconvideopop").click(function (e) {
    e.stopPropagation();
});