합계 스크립트 채택완료
이런식으로 각각 셀렉트 선택을 하면
이렇게 합계를 시키고자 하는데 셀렉트한 상품의 금액이 번갈아 가면서 나오는데요.
각 상품을 셀렉트 할때 마다 금액이 더해졌으면 합니다.
어떻게 수정해야 할까요..
var total = Number($(".frm_total").text()) + Number(result);
이렇게 하니까 하나의 상품 셀렉트로 수량을 바꿀대마다 합계가 되서 안되구요..
아래 볼드처리부분만 수정이 되면 될듯 합니다.
</p>
<p>$(".qty_<?php echo $i ?>").change(function(){</p>
<p> var qty = Number($(".qty_<?php echo $i ?> option:selected").val());
var price = Number($(".qty_<?php echo $i ?>").attr('data-price'));
var result = Number(price * qty);
$(".frm_total").text(result);
<strong>var total = Number($(".frm_total").text(result));
total++</strong>
});</p>
<p>
골라담기 총금액 0 원
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
BiHon5년 전
코드를 보니 상품 개수만큼 코드가 반복되겠군요.
반복문 내에서의 코드는 제거하고, 아래 코드면 되겠네요.
</p>
<p>$('select[class^=qty_]').change(function() { // 뭐가 되었든 클래스명이 qty_로 시작하는 셀렉트박스 값이 변경되면
var total = 0;
$('select[class^=qty_]').each(function() { // 위와 마찬가지로 이에 해당하는 전체 셀렉트박스를 돌며
var qty = Number($(this).find('option:selected').val()); // 수량 구하고
var price = Number($(this).data('price')); // 가격 구하고
total+= qty*price; // 둘을 곱한 값을 더해줘서
});
$('.frm_total').text(total); // 골라담기 총금액에 넣어주면 끝.
});</p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
B
BiHon
5년 전
댓글을 작성하려면 로그인이 필요합니다.
5년 전
말씀하신대로 적용해봤는데 동일하네요...
하나씩 했다고 치면 합산이 되어야 하는데 해당 셀렉트 금액만 번갈아 가면서 나오네요..
로그인 후 평가할 수 있습니다
답변에 대한 댓글 5개
�
5년 전
말씀해주신 코드로 대체 했습니다.
목록이니..for문 안에 있어서
.qty_<?php echo $i ?> 이걸 써야 각 상품별로 작동이 되서 이걸로면 수정했거든요
목록이니..for문 안에 있어서
.qty_<?php echo $i ?> 이걸 써야 각 상품별로 작동이 되서 이걸로면 수정했거든요
B
BiHon
5년 전
그러니까, '반복문' 내에서 질문의 계산 코드가 들어가면 안됩니다.
반복문 내에서의 스크립트는 삭제하거나 주석 처리하고,
반복문 끝나고 나서 댓글에 남긴 스크립트만 추가해주면 됩니다.
반복문 내에서의 스크립트는 삭제하거나 주석 처리하고,
반복문 끝나고 나서 댓글에 남긴 스크립트만 추가해주면 됩니다.
�
5년 전
아! 네 제가 클래스부분 반복함수를 그대로 둬서 인식을 못했던 거였네요.. 잘 됩니다.^^
그런데 "선택해제" 를 클릭 하면 반대로 금액을 빼야 하는데
total -= qty*price; 이렇게 앞에 마이너스 처리 하면 반대로 되는게 맞을까요?
그런데 "선택해제" 를 클릭 하면 반대로 금액을 빼야 하는데
total -= qty*price; 이렇게 앞에 마이너스 처리 하면 반대로 되는게 맞을까요?
B
BiHon
5년 전
"선택하기"는 셀렉트박스가 나오겠고,
"선택해제"는 이를 다시 숨기고, 선택하기 버튼이 나오도록 하는건가요?
어쨌거나, 아래 부분의 코드 내에서 어떤 상태인지 확인해서 처리하면 됩니다.
아래 계산하는 부분을 따로 빼서,
셀렉트박스 변경되거나, 선택해제, 선택하기 등에서 호출하면 편하겠네요.
[code]
$('select[class^=qty_]').each(function() { // 위와 마찬가지로 이에 해당하는 전체 셀렉트박스를 돌며
// 수량 셀렉트박스가 보이는 등 선택 가능한 상태인지 여부 파악
if ( 수량선택가능상태 ) {
var qty = Number($(this).find('option:selected').val()); // 수량 구하고
var price = Number($(this).data('price')); // 가격 구하고
total+= qty*price; // 둘을 곱한 값을 더해줘서
}
});
[/code]
"선택해제"는 이를 다시 숨기고, 선택하기 버튼이 나오도록 하는건가요?
어쨌거나, 아래 부분의 코드 내에서 어떤 상태인지 확인해서 처리하면 됩니다.
아래 계산하는 부분을 따로 빼서,
셀렉트박스 변경되거나, 선택해제, 선택하기 등에서 호출하면 편하겠네요.
[code]
$('select[class^=qty_]').each(function() { // 위와 마찬가지로 이에 해당하는 전체 셀렉트박스를 돌며
// 수량 셀렉트박스가 보이는 등 선택 가능한 상태인지 여부 파악
if ( 수량선택가능상태 ) {
var qty = Number($(this).find('option:selected').val()); // 수량 구하고
var price = Number($(this).data('price')); // 가격 구하고
total+= qty*price; // 둘을 곱한 값을 더해줘서
}
});
[/code]
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인전체 질문 목록
채택
채택
채택
답변대기
채택
채택
채택
답변대기
답변대기
답변대기
채택
채택
채택
채택
채택
채택
채택
답변대기
// 참고로 가격 깔끔하게….
$('.frm_total').text(new Intl.NumberFormat().format(total)); // 1234 → 1,234
[/code]
+ Intl.NumberFormat
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
- https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat