打开和关闭点击事件

Question

所以我正在尝试制作一个照片库，其中： 1.如果您点击其中一张照片，则会弹出一个窗口 2.但是在关闭弹出窗口之前，您无法再次单击任何照片。

我已经搞乱了点击事件并打开和关闭它们。现在我已经可以使用它了，这样当我单击照片时就会弹出窗口，并且我无法单击任何照片。但是，在单击关闭后，我无法将单击功能转回原处。

$("#th1").click(function() {
    $("#dropdown").animate({
        top: "+=400"
    }, 500);
    //fix the pop up so it won't scroll
    $("#dropdown").addClass("fixed");
    //prevent clicking again
    $("#th1,#th2,#th3,#th4,#th5,#th6").off('click');
});

//close the pop up
$('#closedPopUp').click(function(event) {
    //prevent the default functionality
    event.preventDefault();
    //move the pop up back off the screen
    $("#dropdown").css("top", "-250px");
    //turn clicking on again (this part doesn't work)
    $("#th1,#th2,#th3,#th4,#th5,#th6").on('click');
});

Answer 1

你的问题就在这里

$("#th1,#th2,#th3,#th4,#th5,#th6").on('click');

这实际上没有任何作用，因为没有争论点击时要做什么。

您可以将函数分配给变量以使其工作：

var clickFunction = function() {
    // ...
    //prevent clicking again
    $("#th1,#th2,#th3,#th4,#th5,#th6").off('click');
}

$("#th1").click(clickFunction);

//close the pop up
$('#closedPopUp').click(function(event) {
    // ...
    $("#th1,#th2,#th3,#th4,#th5,#th6").on('click', clickFunction);
});