jQuery：单击页面时取消选中复选框

Question

我正在尝试做两件事：

1. 通过取消选中
，确保未在页面加载时选中复选框
2. 如果选中了复选框并且在屏幕上的任何其他位置单击了鼠标，则将取消选中该复选框。

对于第一部分，我尝试过：

$(document).ready(function() {  

    $('#cbox').removeAttr('checked');

});

但是，一旦页面加载，这将不允许我手动检查。

对于第二部分，我试过：

$(document).click(function() {  

    if ($('#cbox').is(':checked')) {
        $('#cbox').removeAttr('checked');
    }

});

但问题是，如果你点击实际复选框来检查它，那么在此之前会触发检查，因此始终不会选中该复选框。

我该如何纠正？

Answer 1

http://jsbin.com/tuqasapare/edit?html,js,console,output

$(document).ready(function() {
    $("#cbox").prop('checked', false);

    $("#cbox").on('click', function(event) {
        event.stopPropagation();
    })

  $(document).click(function() {
      $("#cbox").prop('checked', false);
  })
});