关于多选框 反选问题

<meta charset="utf-8" />
<script src="js/jquery-2.1.3.min.js" type="text/javascript" charset="utf-8"></script>
<div class="box">
    <span>请输入用户名，限定字母、数字或下划线的组合：</span>
    <div class="content">
        <span>水果：</span>
        <input type="checkbox" name="fruit" value="梨子"/>梨子
        <input type="checkbox" name="fruit" value="李子"/>李子
        <input type="checkbox" name="fruit" value="栗子"/>栗子
        <input type="checkbox" name="fruit" value="荔枝"/>荔枝
        <span>蔬菜：</span>
        <input type="checkbox" name="vegetable" value="青菜"/>青菜
        <input type="checkbox" name="vegetable" value="萝卜"/>萝卜
        <input type="checkbox" name="vegetable" value="土豆"/>土豆
        <input type="checkbox" name="vegetable" value="茄子"/>茄子
    </div>       
    <input type="button" id="Button1" value="提交">
    <input type="button" id="Button2" value="全选">
</div>



<script>


$(function(){
    // 设置属性值
    $("#Button1").click(function() {
        var fruit ={};
        var vegetable = 0;
        
        $("input:checkbox[name='fruit']:checked").each(function() {
          fruit[vegetable]=$(this).val();
          vegetable++;
        });
       
        alert(fruit);
             
    });
    
    var val=false;
    
    $("#Button2").click(function(){
   
   
   
    console.log(val);
   
    if (val) {
   
    $(':checkbox').prop('checked',false);
    val=false;
    } else{
   
$(':checkbox').prop('checked',true);
val=true;
    }
   
    })
    
    
})
</script>