한 div의 텍스트가 다른 두 div의 텍스트를 기반으로 동적으로 변경됩니다.

Question

세 개의 div가 있습니다. 수량, 가격 및 비용. 비용은 가격 * 수량의 곱셈입니다.

<div class="qty">1</div> 
<div class="price">49</div> 
<div class="cost"><div> 

<div class="add">ADD</div> 

다음으로 qty 값을 증가시키는 추가 버튼이 있습니다. jQuery를

$('.add').on('click',function(){ 
     $('.qty').text(parseInt($('.qty').text()) + 1); 
}); 

는 지금은 수량 * 가격입니다 "비용"DIV에서 텍스트를 넣어합니다. 그리고 이것은 수량의 변화에 ​​따라 동적으로 변해야합니다. 어떻게해야합니까 ?? 다음은 remove 버튼을 추가하려는 경우

$('.add').on('click',function(){ 
    var qty = parseInt($('.qty').text()) + 1, 
     price = parseInt($('.price').text()); 
    $('.qty').text(qty); 
    $('.cost').text(qty * price); 
}); 

:

Answer 1

qty을 변경할 수있는 유일한 방법은 거기 비용 업데이트 변경 코드를 넣어 사소한되는 다음 add을 눌러 경우 별도의 업데이트 기능을 만들어야합니다.

$('.add').on('click',function(){ 
    $('.qty').text(parseInt($('.qty').text()) + 1); 
    update_cost(); 
}); 
$('.remove').on('click',function(){ 
    $('.qty').text(parseInt($('.qty').text()) - 1); 
    update_cost(); 
}); 

var update_cost = function() { 
    var qty = parseInt($('.qty').text()), 
     price = parseInt($('.price').text()); 
    $('.cost').text(qty * price); 
} 

Answer 2

$('.add').on('click',function(){ 
     $('.qty').text(parseInt($('.qty').text()) + 1); 
     $('.cost').text(parseInt($('.qty').text()) * parseInt($('.price').text()); 
});