la funzione ti riporta i valori, poi puoi stamparli dove ti pare quando ti pare. Crei dei DIV o span immediatamente a CONTATTO con le input (senza spazi o ritorni a capo di mezzo), e assegni i valori della input al nextSibling con innerHTML
codice:
<form name="checkboxes" id="checkboxes" method="POST" action="elabora.php" style="display:block">
<input type="checkbox" name="checkbox[1]" id="checkbox1" value="100" onclick="this.nextSibling.innerHTML=(this.checked)?this.value:'Campo 1'; boh()" /><span>Campo 1</span>
<input type="checkbox" name="checkbox[2]" id="checkbox2" value="200" onclick="this.nextSibling.innerHTML=(this.checked)?this.value:'Campo 2'; boh()" /><span>Campo 2</span>
<input type="checkbox" name="checkbox[3]" id="checkbox3" value="300" onclick="this.nextSibling.innerHTML=(this.checked)?this.value:'Campo 3'; boh()" /><span>Campo 3</span>
<input type="checkbox" name="checkbox[4]" id="checkbox4" value="400" onclick="this.nextSibling.innerHTML=(this.checked)?this.value:'Campo 4'; boh()" /><span>Campo 4</span>
<div id="somma">Totale</div>
<input type="submit" value="Aggiungi" />
</form>
CLICCA PER TESTARE
<script>
function boh(){
var wrapper=document.getElementById('checkboxes');//è l' id della form
window['checkflaggati']=[]; window['tuttiicheck']=[]; window['sommacheck']=0;/*variabli globali, più semplice per te, forse*/
for(var i=0, e=wrapper.getElementsByTagName('INPUT'); i<e.length; i++){
if(e[i].type=="checkbox"){
window['tuttiicheck'][++window['tuttiicheck'].length-1]=e[i].value;/*io uso ++length-1, concettualmente più giusto*/
if(e[i].checked){
window['checkflaggati'][++window['checkflaggati'].length-1]=e[i].value;
window['sommacheck']+=parseInt(e[i].value);
};
};
}
document.getElementById('somma').innerHTML=window['sommacheck'];
}
</script>