1

我想通过单击页面上的某个位置来隐藏 div，但前提是首先通过单击预览显示 div。

我有这个 ：

$(function() {  
    $("#videopreview").click(function() {
    $("#videolarge").css({ display: 'block' });
    $("#videopreview").css({ display: 'none' });

        $("#videolarge").click(function(){ return false; });
        $(document).one("click", function() { 
        $("#videolarge").css({ display: 'none' });
        $("#videopreview").css({ display: 'block' });

        });
    });
});

它同时运行这两个功能，所以什么也没发生:)

更新：

$(function() {  
$("#videopreview").click(function() {
    $("#videolarge").css({ display: 'block' });
    $("#videopreview").css({ display: 'none' });
});
$("#videolarge").click(function(){ return false; });
$("#videopreview").click(function(){ return false; });
$(document).click(function() { 
    $("#videolarge").css({ display: 'none' });
    $("#videopreview").css({ display: 'block' });
});
});

我可以使用 remove() 但是一旦隐藏我就不能再次运行它（这是有道理的）。我该如何处理？

4

2 回答 2

0

您不应该在另一个事件函数中使用该事件。那是行不通的。

请改用此代码：

$(function() {  
    $("#videopreview").click(function() {
        $("#videolarge").css({ display: 'block' });
        $("#videopreview").css({ display: 'none' });
    });
    $("#videolarge").click(function(){ return false; });
    $(document).one("click", function() { 
        $("#videolarge").css({ display: 'none' });
        $("#videopreview").css({ display: 'block' });
    });
});
于 2013-02-02T17:30:37.563 回答
0

如果您从一开始就附加两个处理程序，但在 document.click 处理程序中，在尝试执行任何操作之前检查大视频是否可见，并检查是否不是单击的视频预览。就像是：

$(function()
{  
    $("#videopreview").on('click', function()
    {
        $("#videolarge").css({ display: 'block' });
        $("#videopreview").css({ display: 'none' });
    });

    $(document).on("click", function(e)
    {
        if ($("#videolarge").is(":visible") && e.target.id !== "videopreview")
        {
            $("#videolarge").css({ display: 'none' });
            $("#videopreview").css({ display: 'block' });
        }
    });
});

旁注：与其直接设置两个元素的 CSS 属性，不如拥有可以添加或删除的适当 CSS 类可能更简洁、更快捷。

于 2013-02-02T17:45:28.127 回答