Javascript 单击外部时如何取消选中复选框？

我通过复选框创建一个水滴列表。如果选中复选框，则显示并消失水滴列表。。。 我想制作一个javascript代码，当用户在空白区域单击外部时取消选中复选框

我尝试了以下javascript：

<script language="javascript">
    document.getElementById("drop1").checked = true;
    document.getElementById("drop1").checked = false;
</script>

document.getElementById（“drop1”）.checked=true；
document.getElementById（“drop1”）.checked=false；

但它不起作用

这是输入表单：

<input type="checkbox" checked="" id="drop1" />

---

提前感谢

当用户在下拉列表外单击时，使用下面的js代码隐藏

包括jquery并添加此代码

$(document).mouseup(function (e)
{
    var container = $("selector to dropdown list");

    if (!container.is(e.target) // if clicked outside
        && container.has(e.target).length === 0)nor a descendant of the container
    {
        container.hide();
        $( "#drop1" ).prop( "checked", false ); //to uncheck
    }
});

---

您可以首先在click事件中找到元素，然后相应地编写逻辑

$(document).click(function(e) {
    var x = e.clientX, y = e.clientY,
    elementOnClick = document.elementFromPoint(x, y);
    var z = elementOnClick.id;
    if(z!="drop1" && !z.is(":visible"))
    {
       document.getElementById("drop1").checked = false;
    }
});

---

如果您纯粹想在javascript中实现这一点，那么可以在文档上添加EventListener，使用标签。标签充当其关联控件的大可单击区域

如果jQuery标记不存在，那么答案应该是纯JavaScript。请看JavaScript标签wiki。坦白地说，我对JavaScript和Jquery不太在行。。。所以，你能给我一个代码来实现，让我自己理解它的逻辑。。。很抱歉，包含一个5行代码的库会很奇怪。您必须在元素和足够大的父元素上创建click事件侦听器；我应该警告你，这不是直观的设计。