将选择器与 jquery 中的输入值相乘

multiply selectors with input values in jquery

我的计算不太好。也许你可以帮助我:

  <input id="count" min="1" value="1" class ="txtMult form-control" type="number" name="txtEmmail" />
  <input type="text" value="250"  class ="txtMult" name="txtEmmail"/>
  <span class="multTotal">250</span>

<select class="selectpicker">
<option value="1">multiply with 1</option>
<option value="2">multiply with 2</option>
</select>

<span id="grandTotal">250</span>

这里是 Javascript:

$(function(){
                $('input').change(function(){
                    var p=$(this).parent().parent()
                    var m=p.find('input.txtMult')
                    var mul=parseInt($(m[0]).val()*$(m[1]).val()).toFixed(2)
                    var res=p.find('.multTotal')
                    res.html(mul);
                    var total=0;
                    $('.multTotal').each(function(){
                        total+=parseInt($(this).html())
                    })
                    $('#grandTotal').html(parseInt(total).toFixed(2))
                });
            })


$(window).load(function(){
$('select').change(function() {
   $("#grandTotal").html($('select').val()*$('.multTotal').html())
});
});
</script>

所以我希望#grandTotal 总是正确变化。如果 select 例如 "multiply with 2" 并且在更改我的“#count”的值之后,“#grandTotal”应该会自动显示正确的数字。我对计算很困惑。也许你看得更清楚了。非常感谢

在javascript端计算时,必须解析为int或float。

您可以使用parseInt or parseFloat()

var i = parseInt( $('select').val()) * parseInt( $('.multTotal').html())
$("#grandTotal").html(i);

工作fiddle http://jsfiddle.net/anilk/6fLk8w8a/1/

更新了 js

 $(function(){
                $('.txtMult').change(function(){
                    alert("work");
                    var p=$(this).parent().parent()
                    var m=p.find('input.txtMult')
                    var mul=parseInt($(m[0]).val()*$(m[1]).val()).toFixed(2)
                    var res=p.find('.multTotal')
                    res.html(mul);
                    var total=0;
                    $('.multTotal').each(function(){
                        total+=parseInt($(this).html());
                    })
                    alert(parseInt(total).toFixed(2));
                    $('#grandTotal').html(parseInt(total).toFixed(2));
                });
            })



$('.selectpicker').change(function() {
    calcVal();
});

function calcVal(){
    alert($('select').val()*$('.multTotal').html());
   $("#grandTotal").html($('select').val()*$('.multTotal').html())
}

// call on document load
calcVal();

您的绑定不正确,请使用正确的 class。