Necesito ayuda. En mi programación html tengo 3 cajas, cada caja contiene 3 inputs ocultados con (display "none"), cada input tiene un respectivo botón(button), el cual sirve para mostrar o desplegar ese input oculto. El punto es que quiero que se sumen los últimos input de cada caja, es decir que si la caja una tiene solo un input desplegado, y la segunda caja tiene 2 inputs, y la tercera tiene sus tres inuts desplegados, pues entonces, me sumara el primer input de la caja uno, mas el segundo input de la caja 2, mas el 3 input de la caja 3, lo que quiero es que se sumen los últimos inputs de cada caja, si las 3 cajas tienen sus tres inputs desplegados, pues sumaran el tercer o ultimo input de cada caja. En poquitas y repetitivas palabras pues se sumaran los ultimos input de cada caja, si una caja tiene solo un input desplegado, pues se sumara ese input con el ultimo input de la otra caja. Esto es de urgencia, por favor necesito ayuda, no tendria con que pagarle al que me ayude.
Aquí Anexo mi código para que vean y por favor les ruego me ayuden:
<!DOCTYPE html>
<html>
<head>
<title>Sumando Cajas</title>
<script type="text/javascript">
function apa1() {
document.getElementById('input1').style.display = "block";
}
function apa2() {
document.getElementById('input2').style.display = "block";
}
function apa3() {
document.getElementById('input3').style.display = "block";
}
function apa4() {
document.getElementById('input4').style.display = "block";
}
function apa5() {
document.getElementById('input5').style.display = "block";
}
function apa6() {
document.getElementById('input6').style.display = "block";
}
function apa7() {
document.getElementById('input7').style.display = "block";
}
function apa8() {
document.getElementById('input8').style.display = "block";
}
function apa9() {
document.getElementById('input9').style.display = "block";
}
function apa10() {
document.getElementById('input10').style.display = "block";
}
</script>
</head>
<!--Tengo tres cajas, cada caja contiene 3 inputs ocultos, con botones para aparecerlos-->
<div>
<h1>Primera caja:</h1>
<button onclick="apa1()">Aparecer input1</button><br>
<input type="text" placeholder="numero 1" name="" id="input1" style="display: none;"><Br>
<button onclick="apa2()">Aparecer input2</button><br>
<input type="text" placeholder="numero 2" name="" id="input2" style="display: none;"><Br>
<button onclick="apa3()">Aparecer input3</button><br>
<input type="text" placeholder="numero 3" name="" id="input3" style="display: none;"><Br>
</div>
<div>
<h1>segunda caja:</h1>
<button onclick="apa4()">Aparecer input4</button><br>
<input type="text" placeholder="numero 4" name="" id="input4" style="display: none;"><br>
<button onclick="apa5()">Aparecer input5</button><br>
<input type="text" placeholder="numero 5" name="" id="input5" style="display: none;"><br>
<button onclick="apa6()">Aparecer input6</button><br>
<input type="text" placeholder="numero 6" name="" id="input6" style="display: none;"><br>
</div>
<div>
<h1>Tercera caja:</h1>
<button onclick="apa7()">Aparecer input7</button><br>
<input type="text" placeholder="numero 7" name="" id="input7" style="display: none;"><br>
<button onclick="apa8()">Aparecer input8</button><br>
<input type="text" placeholder="numero 8" name="" id="input8" style="display: none;"><br>
<button onclick="apa9()">Aparecer input9</button><br>
<input type="text" placeholder="numero 9" name="" id="input9" style="display: none;"><br>
</div>
<br>
<!--Este boton debera sumara el ultimo input de cada caja-->
<button>Sumar</button>
<input type="text" placeholder="resultado" name="">
</body>
</html>