반복문을 이용해 동적 변수를 할당 하려면 어떻게 해야 하나요?
본문
위의 질문글 중에 input 값의 합계를 자동으로 구해지는 부분이 그걸 보다가 제가 찾는 비슷한 궁금점이 있어서
질문을 남겨봅니다.
<script>
$(document).ready(function() {
$('.sum_11').change(function(evt) {
var sum11 = 0;
$('.sum_11').each(function(){
sum11 += +$(this).val() ;
});
$('input[name=wr_27]').val(Math.round(sum11)) ;
});
});
</script>
input class의 값이 sum_11이라는 input값 수를 넣으면
자동으로 wr_27값에 class sum_11의 값들의 합이 출력되는 소스인데
잘 동작합니다.
<script>
$(document).ready(function() {
for( var i=1 ; i < 4; i++) {
$('.sum_11').change(function(evt) {
var sum11 = 0;
$('.sum_11').each(function(){
sum11 += +$(this).val() ;
});
$('input[name=wr_27]').val(Math.round(sum11)) ;
});
}
});
</script>
그런데 예를들어 위와 같은 for 문을 돌려 합계가 구해지는 항목을 추가하고자 할때
위 빨간 부분을 어떻게 변수처리 해야 할까요?
자동으로 합계가 기록되는 input 값이 여러개 인경우
예를들어
sum_1의 값들의 자동합계 wr_1
sum_2의 값들의 자동합계 wr_2
sum_3의 값들의 자동합계 wr_3
......
이런 동적 변수할당을 해서 구하고 싶습니다.
답변 2
이렇게 하는건 어떠실까요?
<script>
$(document).ready(function() {
var sumArray = []; // 합계를 저장할 배열
for (var i = 1; i <= 3; i++) {
$('.sum_' + i).change(function(evt) {
var index = $(this).data('index'); // input 요소의 인덱스 값을 가져옴
var sum = 0;
$('.sum_' + index).each(function() {
sum += +$(this).val();
});
$('input[name=wr_' + index + ']').val(Math.round(sum));
// 배열에 합계 저장
sumArray[index] = sum;
// 모든 합계를 출력 (예시)
for (var j = 1; j <= 3; j++) {
console.log('wr_' + j + ' 합계:', sumArray[j]);
}
});
}
});
</script>
꼼꼼한 답변 감사 합니다.
한 번 해보겠습니다.
$(document).ready(function() {
for( var i=1 ; i < 4; i++) {
var variant = 'sum_' + i;
$(`.${variant}`).change(function(evt) {
$(`.${variant}`).each(function(){
variant += +$(this).val() ;
});
$(`input[name=wr_${i}]`).val(Math.round(variant)) ;
});
}
});
감사합니다. 한 번 해보겠습니다.