일마를 줄이고 싶은데요
본문
1과 2 를 곱하고 3을 더한 값이 우측에 나오고
맨밑에는 토탈 값이 나오는 식인데요,,,
15줄을 쓰려니 스크립트 소스가 너무 복잡해지는 거 같아서요,,
이거 어떻게 할 수 있을까요?
<script language='javascript'>
function sum(n) {
var t = 0;
for(i=1; i<4; i++) {
t = t + Number(document.getElementById("f" + n + "_" + i).value);
}
document.getElementById("f" + n + "_4").value = t;
f1_4.value = Number(f1_1.value)*Number(f1_2.value)+Number(f1_3.value);
f2_4.value = Number(f2_1.value)*Number(f2_2.value)+Number(f2_3.value);
f3_4.value = Number(f3_1.value)*Number(f3_2.value)+Number(f3_3.value);
f4_4.value = Number(f4_1.value)*Number(f4_2.value)+Number(f4_3.value);
f5_4.value = Number(f5_1.value)*Number(f5_2.value)+Number(f5_3.value);
f6_4.value = Number(f6_1.value)*Number(f6_2.value)+Number(f6_3.value);
f7_4.value = Number(f7_1.value)*Number(f7_2.value)+Number(f7_3.value);
document.getElementsByName("all_total")[0].value = Number(document.getElementsByName("total")[0].value) + Number(document.getElementsByName("total")[1].value) + Number(document.getElementsByName("total")[2].value) + Number(document.getElementsByName("total")[3].value) + Number(document.getElementsByName("total")[4].value) + Number(document.getElementsByName("total")[5].value) + Number(document.getElementsByName("total")[6].value);
}
</script>
<INPUT id=f1_1 onkeyup="sum(1);">
<INPUT id=f1_2 onkeyup="sum(1);">
<INPUT id=f1_3 onkeyup="sum(1);">
<INPUT id=f1_4 name=total><br>
<INPUT id=f2_1 onkeyup="sum(2);">
<INPUT id=f2_2 onkeyup="sum(2);">
<INPUT id=f2_3 onkeyup="sum(2);">
<INPUT id=f2_4 name=total><br>
<INPUT id=f3_1 onkeyup="sum(3);">
<INPUT id=f3_2 onkeyup="sum(3);">
<INPUT id=f3_3 onkeyup="sum(3);">
<INPUT id=f3_4 name=total><br>
<INPUT id=f4_1 onkeyup="sum(4);">
<INPUT id=f4_2 onkeyup="sum(4);">
<INPUT id=f4_3 onkeyup="sum(4);">
<INPUT id=f4_4 name=total><br>
<INPUT id=f5_1 onkeyup="sum(5);">
<INPUT id=f5_2 onkeyup="sum(5);">
<INPUT id=f5_3 onkeyup="sum(5);">
<INPUT id=f5_4 name=total><br>
<INPUT id=f6_1 onkeyup="sum(6);">
<INPUT id=f6_2 onkeyup="sum(6);">
<INPUT id=f6_3 onkeyup="sum(6);">
<INPUT id=f6_4 name=total><br>
<INPUT id=f7_1 onkeyup="sum(7);">
<INPUT id=f7_2 onkeyup="sum(7);">
<INPUT id=f7_3 onkeyup="sum(7);">
<INPUT id=f7_4 name=total><br>
<input type="text" name="all_total">
답변 4
<script language='javascript'>
function sum(n) {
var t = 0;
for(i=1; i<4; i++) {
t = t + Number(document.getElementById("f" + n + "_" + i).value);
}
document.getElementById("f" + n + "_4").value = t;
var sum = 0;
for(i=1;i<8;i++){
document.getElementById("f" + i + "_4").value = Number(document.getElementById("f" + i + "_1").value ) * Number(document.getElementById("f" + i + "_2").value) + Number(document.getElementById("f" + i + "_3").value);
sum += parseInt(document.getElementById("f" + i + "_4").value);
}
document.getElementsByName("all_total")[0].value = sum;
}
</script>
고수님들이 총출동해주셨군요~
감사합니다~ 좋은 하루되세요~
for($i=1;$i<8;$i++){
//코드처리
}
이렇게 해보세요~
감사합니다~ 좋은 하루되세요~
아래처럼 class설정 후 초간단 자바스크립트로
<INPUT class='f1'>
<INPUT class='f1'>
<INPUT class='f1'>
<INPUT class='totalf1' name=total1><br>
<INPUT class='f2'>
<INPUT class='f2'>
<INPUT class='f2'>
<INPUT class='totalf2' name=total2><br>
.....
.......
<input type="text" name="all_total" id='all_total'>
<script>
$(document).on("keyup", ".f1, .f2, .f3, .f4,.f5,.f6, .f7", function() {
var sum=0;
var sum2=0;
classN= $(this).attr('class'); classN2= $('.'+classN);
sum = 1* classN2.eq(0).val() * classN2.eq(1).val() + 1* classN2.eq(2).val();
$('.total'+classN).val(sum);
$('input[class^=total]').each(function(){ sum2+= $(this).val() *1; });
$('#all_total').val(sum2);
});
</script>
고수님들이 총출동해주셨군요,,
감사합니다~ 좋은 하루되세요~
폼부분
<?php for($i=1; $i<8; $i++) { ?>
<INPUT id=f<?php echo $i; ?>_1 onkeyup="sum(<?php echo $i; ?>);">
<INPUT id=f<?php echo $i; ?>_2 onkeyup="sum(<?php echo $i; ?>);">
<INPUT id=f<?php echo $i; ?>_3 onkeyup="sum(<?php echo $i; ?>);">
<INPUT id=f<?php echo $i; ?>_4 name=total><br>
<?php } ?>
<input type="text" name="all_total">
