2013-11-04 54 views
1

我使用下面的代碼將數量乘以價格。代碼工作正常,但是當我有多個行時,它會將價格從第一行添加到第二行扣除或添加數量時顯示每行的價格

如何讓價格僅顯示該行而不顯示以前的行?

我已創建一個小提琴顯示什麼,我試圖做

http://jsfiddle.net/STpP3/

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>demo</title> 

    <script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script> 


    <style type='text/css'> 

    </style> 

      <script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){ 
$('.minus, .plus').click(function (e) { 
    e.preventDefault();  
    var $input = $(this).siblings('.qty'); 
    var val = parseInt($input.val(), 10); 
    $input.val(val + ($(this).hasClass('minus') ? -1 : 1)); 
}); 

});//]]> 

</script> 

<script type='text/javascript'>//<![CDATA[ 
$(function(){ 
$('.minus, .plus').click(function() { 
    var sibs = $(this).siblings(); 
    var quantity = $('.qty').val(); 

    var priceItem = sibs.filter(".price").val(); 

    var total2 = quantity * priceItem; 
    var total = (+total2 + +priceItem); 



    sibs.filter(".total").val(total); 












}); 
});//]]> 

</script> 


</head> 
<body> 

<?php 
$x=1; 
while($x<=5) 
    { 
    ?> 
    <div>Qty: 
     <span class='minus' class="signrm">&mdash;</span> <input type="text" name="qty" class="txt qty" value="1" /> <span class='plus' >+</span> 
    <br/>Price: 
    <input type="text" name="price" class="txt price" value="500" /> 
    <br/>Total: 
    <input type="text" name="total" class="txt total" value="500" /> 
</div> 
<?php 
$x++; } ?> 


</body> 


</html> 

回答

2

你在正確的軌道上,只要確保你從按鈕的兄弟姐妹讓所有的值。此外,您的窗口負載點擊事件不起作用。我無法看到你的問題。但我會在一個點擊事件而不是兩個事件中執行所有代碼。

這裏是一個fiddle的例子,下面是代碼。

$(function() { 
    $('.minus, .plus').click(function() { 
     var $qty = $(this).siblings('.qty'); 
     var qtyCounter = parseInt($qty.val()); 
     if($(this).hasClass('plus')) 
      qtyCounter++; 
     else 
      qtyCounter--; 
     $qty.val(qtyCounter); 
     var pricePerUnit = $(this).siblings('.price').val(); 
     var quantity = $(this).siblings('.qty').val(); 
     var total = quantity * pricePerUnit; 
     $(this).siblings('.total').val(total); 
    }); 
});