Refiz o seu código para você ter um exemplo de como pode ficar mais simples a sua logica.
Não refiz tudo do zero, apenas editei algumas partes que achei obvio usar loops e arrays.
JS:
var $checkboxList = $('input[type="checkbox"]'),
$resultadoList = $('.item-resultado'),
$bgcb = $('.bgradio'),
$exiberesultado = $('#resultado'),
$btnImprimir = $("#btnImprimir");
function verificar() {
// Verifica se não existe input selecionados
if ($("form input:checkbox:checked").length == 0) {
alert("Selecione algum número");
document.getElementsByClassName("item-resultado").style.display = "none";
}
$exiberesultado.html('');
$checkboxList.each(function(i){
//mostra apenas os não selecionados
if(this.checked == false){
$exiberesultado.append('<li class="item-resultado">'+this.value+', </li>');
}
});
$btnImprimir.css("display", "initial");
};
function maisque10 () {
// controla se tem mÃnimo 10 escolhidos
$('form').on("click", 'input[type="checkbox"]', function (e) {
if ($("form input:checkbox:checked").length >= 10) {
alert("Voce selecionou 10 numeros");
e.preventDefault();
}
});
}
maisque10();
function limpar() {
location.reload();
}
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Estudo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<script src="http://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<!-- Latest compiled and minified CSS -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<body>
<div class="content">
<h3 class="text-center">Estudo</h3>
<div id="number">
<form name="form">
<div class="bgcb cbbuttons">01<input type="checkbox" value="01"></div>
<div class="bgcb cbbuttons">02<input type="checkbox" value="02"></div>
<div class="bgcb cbbuttons">03<input type="checkbox" value="03"></div>
<div class="bgcb cbbuttons">04<input type="checkbox" value="04"></div>
<div class="bgcb cbbuttons">05<input type="checkbox" value="05"></div><br>
<div class="bgcb cbbuttons">06<input type="checkbox" value="06"></div>
<div class="bgcb cbbuttons">07<input type="checkbox" value="07"></div>
<div class="bgcb cbbuttons">08<input type="checkbox" value="08"></div>
<div class="bgcb cbbuttons">09<input type="checkbox" value="09"></div>
<div class="bgcb cbbuttons">10<input type="checkbox" value="10"></div><br>
<div class="bgcb cbbuttons">11<input type="checkbox" value="11"></div>
<div class="bgcb cbbuttons">12<input type="checkbox" value="12"></div>
<div class="bgcb cbbuttons">13<input type="checkbox" value="13"></div>
<div class="bgcb cbbuttons">14<input type="checkbox" value="14"></div>
<div class="bgcb cbbuttons">15<input type="checkbox" value="15"></div><br>
<div class="bgcb cbbuttons">16<input type="checkbox" value="16"></div>
<div class="bgcb cbbuttons">17<input type="checkbox" value="17"></div>
<div class="bgcb cbbuttons">18<input type="checkbox" value="18"></div>
<div class="bgcb cbbuttons">19<input type="checkbox" value="19"></div>
<div class="bgcb cbbuttons">20<input type="checkbox" value="20"></div><br>
<div class="bgcb cbbuttons">21<input type="checkbox" value="21"></div>
<div class="bgcb cbbuttons">22<input type="checkbox" value="22"></div>
<div class="bgcb cbbuttons">23<input type="checkbox" value="23"></div>
<div class="bgcb cbbuttons">24<input type="checkbox" value="24"></div>
<div class="bgcb cbbuttons">25<input type="checkbox" value="25"></div><br>
</form>
</div>
<ul id="resultado">
</ul>
<div class="clear"></div>
<div class="botoes">
<button type="button" onclick="verificar();" id="btncheckar" class="btn btn-success">Veriricar</button>
<button type="button" onclick="limpar();" id="btnLimpar" class="btn btn-default">Limpar</button>
<button type="button" onclick="print();" class="btn btn-default" id="btnImprimir">Imprimir</button>
</div>
</div>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script language="JavaScript" type="text/javascript" src="campos.js"></script>
</body>
</html>
CSS:
* {
margin: 0;
padding: 0;
}
@media print {
.number { visibility:hidden; }
form { visibility:hidden; }
.botoes { visibility:hidden; }
h3 { visibility:hidden; }
#resultado {
visibility: visible;
position: absolute;
top:0;
left:0;
}
}
.content {
width: 1200px;
height: auto;
margin: 0 auto;
}
#number {
width: 600px;
height: auto;
margin: 0 auto;
margin-top: 50px;
font-size: 28pt;
font-family: verdana;
text-align: center;
}
.bgcb {
width: 80px;
height: 50px;
background-color: white;
display: inline-block;
font-size: 20pt;
border: 1px solid #d8d8d8;
border-radius: 15px;
}
.bgcbchange {
background-color: black;
}
#resultado {
width: 1200px;
font-size: 20pt;
font-family: verdana;
height: 50px;
margin: 20px;
text-align: center;
visibility: visible;
}
.item-resultado {
display: inline;
margin-left: 5px;
}
.botoes {
width: auto;
height: auto;
margin: 0px auto;
text-align: center;
}
#btnImprimir {
display: none;
text-align: center;
}
input[type=checkbox] {
padding: 10px;
}
.clear {
clear: both;
}