In this script my down script is not passing the results to the fields anyway no one would have a light how can I solve this
$(window).load(function(){
var contador = function() {
var n = $("input:enabled:checked").length;
var unchecked = 0;
var cb = $(this).index();
$("input:enabled").each(function(i) {
if ((i < cb) && !($(this).is(":checked"))) {
++unchecked;
}
})
if($(this).is(":checked")){
$('#campo').append('<div style="margin-top: 10px;"><input type="text" placeholder="Insira seu Ticket" name="tks[]" required class="created" name="check1" ></div>');
}else{
$('.created').eq($(this).index()-unchecked).remove();
}
$("#checkcount").text(n + (n === 1 ) + " Cadeiras Marcadas");
};
contador();
$("input[type=checkbox]").on("click", contador);
(function() {
var elements = document.getElementsByTagName('input');
var resultado = document.getElementById('resultado_soma');
$('#result').val(resultado);
var total = 0;
for (var i = 0; i < elements.length; i++) {
elements[i].onclick = function() {
if (this.checked === false) {
total = total - this.value;
} else {
total = total + parseFloat(this.value);
}
resultado.innerHTML = 'R$ ' + total.toFixed(2).replace(".",",");
}
}
})();
});
.mesa input { visibility: hidden; }
.mesa {
position:relative; float:left;
width:140px; height:140px;
background:url('http://i.stack.imgur.com/MI8cD.png') no-repeat center center;
}
.mesa label {
position:absolute; display: block;
width:36px; height:32px; left:50%; top:50%; margin-left:-18px; margin-top:-16px;
background:url('http://i.stack.imgur.com/27Y0g.png') no-repeat center top;
}
.mesa input:checked + label {
background:url('http://i.stack.imgur.com/aHDoy.png') no-repeat center top;
}
.mesa span {
position:absolute; display:block; left:50%; top:50%; -webkit-transform:translate(-50%,-50%);
font:bold 15px Arial, Helvetica, sans-serif;
}
.mesa4 input { visibility: hidden; }
.mesa4 {
position:relative; float:left;
width:140px; height:140px;
background:url('http://i.imgur.com/EMhWAZP.png') no-repeat center center;
}
.mesa4 label {
position:absolute; display: block;
width:36px; height:32px; left:50%; top:50%; margin-left:-18px; margin-top:-16px;
background:url('http://i.stack.imgur.com/27Y0g.png') no-repeat center top;
}
.mesa4 input:checked + label {
background:url('http://i.stack.imgur.com/aHDoy.png') no-repeat center top;
}
.mesa4 span {
position:absolute; display:block; left:50%; top:50%; -webkit-transform:translate(-50%,-50%);
font:bold 15px Arial, Helvetica, sans-serif;
}
.l1 { -webkit-transform:translateY(-50px) }
.l2 { -webkit-transform:rotate( 60deg) translateY(-50px) }
.l3 { -webkit-transform:rotate(120deg) translateY(-50px) }
.l4 { -webkit-transform:rotate(180deg) translateY(-50px) }
.l5 { -webkit-transform:rotate(240deg) translateY(-50px) }
.l6 { -webkit-transform:rotate(300deg) translateY(-50px) }
.l7 { -webkit-transform:rotate(90deg) translateY(-50px) }
.l8 { -webkit-transform:rotate(270deg) translateY(-50px) }
In Divs the results appears perfectly more if you move to an input nothing appears
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><body><divstyle="position: absolute; left: 200px; "class="mesa">
<input type="checkbox" id="m1" name="m301" value="200" /><label class="l1" for="m1"></label>
<input type="checkbox" id="m2" name="m301" value="200" /><label class="l2" for="m2"></label>
<input type="checkbox" id="m3" name="m301" value="200" /><label class="l3" for="m3"></label>
<input type="checkbox" id="m4" name="m301" value="200" /><label class="l4" for="m4"></label>
<input type="checkbox" id="m5" name="m301" value="200" /><label class="l5" for="m5"></label>
<input type="checkbox" id="m6" name="m301" value="200" /><label class="l6" for="m6"></label>
</div>
<div style="position: absolute; left: 10px;">
<div id="checkcount"></div>
<div id="resultado_soma"></div>
<div id="campo"></div>
</div>
<div style="position: absolute; left: 400px;"><br /><br />
<input type="text" id="resultado_soma2" name="resultado_soma2" placeholder="Total" /><br />
<input type="text" id="checkcount2" name="checkcount2" placeholder="N de cadeiras" /><br />
</div>
</body>