2011-01-11 83 views
0

我試圖從2給定的數量和價格計算出一個值。我使用jquery中的keyup事件來計算qty和price的當前值。 我將如何能夠引用啓動按鍵事件的當前文本框。並將相應的總數放到指定的框中。
你知道任何jQuery插件,這將使我更容易實現結果。如何獲得jquery中的文本框的當前值

<script type="text/javascript"> 
$(function(){ 

$('input[name^=qty]').keyup(function(){ 

    var curprice=$('input[name^=price]').val(); 
    var curqty=$('input[name^=qty]').val(); 
    var curtotal=curprice * curqty; 

    $('input[name^=comp]').val(curtotal); 
}); 




}); 

</script> 

</head> 
<body> 




<?php 
for($a=0;$a<=5;$a++){ 
    ?> 


    Price:<input type="text" name="<?php echo 'price'.$a; ?>" value="<?php echo $a; ?>"/> 
    Quantity:<input type="text" name="<?php echo 'qty'.$a; ?>" value="<?php echo $a; ?>"/> 
    Computed:<input type="text" id="<?php echo 'a'.$a; ?>" name="<?php echo 'comp'.$a ?>" value="" /> 


    <?php 
echo "<br/>"; 
} 

?> 




</body> 
</html> 

赫雷什的屏幕截圖。 alt text

如果您需要更多的細節,請隨時問,謝謝。

回答

1
<script type="text/javascript"> 
$(function(){ 

$('input[name^=qty]').keyup(function(){ 

    var parentDiv = $(this).closest('div'); 
    var curprice=parentDiv.find('input[name^=price]').val(); 
    var curqty= this.value; 
    var curtotal=curprice * curqty; 

    parentDiv.find('input[name^=comp]').val(curtotal); 
}); 




}); 

</script> 

</head> 
<body> 




<?php 
for($a=0;$a<=5;$a++){ 
    ?> 

    <div> 

    Price:<input type="text" name="<?php echo 'price'.$a; ?>" value="<?php echo $a; ?>"/> 
    Quantity:<input type="text" name="<?php echo 'qty'.$a; ?>" value="<?php echo $a; ?>"/> 
    Computed:<input type="text" id="<?php echo 'a'.$a; ?>" name="<?php echo 'comp'.$a ?>" value="" /> 

    </div> 
    <?php 
echo "<br/>"; 
} 

?> 




</body> 
</html> 

注意對您當前的代碼所做的所有更改。

1

這是別的。它使用正則表達式來獲取元素名稱的數字部分,並假定名爲priceX和compX的東西是相關的輸入。

$("input[name^=qty]").keyup(function() { 

    var i = /^qty(\d+)$/.exec($(this).attr('name'))[1], 
     price = parseFloat($("input[name=price" + i + "]").val()), 
     qty = parseInt($("input[name=qty" + i + "]").val(), 10); 

    $("input[name=comp" + i + "]").val(price * qty); 

}); 

實施例:http://jsfiddle.net/AHUHu/

相關問題