javascript - 购物车数量变化时动态改变小计

Question

我只是想要javascript代码来实现这个简单的事情。小计价格应根据用户更改的数量进行更改。如果价格为 1000，数量更改为 2，则小计应为 2000。

这是我的代码:

<input type="number" min="0" class="form-control" id="quantity" value="1">
</td>
<td>
    <input type="text" class="form-control" id="price" value="1000" readonly>
</td>
<td>
    <input type="text" class="form-control" id="subTotal" value="1000">
</td>

我对 javascript 的了解为零。也请告诉我如何在我的 HTML 中添加脚本。

Answer 1

$(document).ready(function(){
    $("#quantity").change(function(){
        $("#subTotal").val(parseInt($(this).val()) * parseInt($("#price").val()));
    });
});

我已经为你添加了一个 plunker - http://plnkr.co/edit/aF6G1SSJZTLREH6cBBul

首先，将您的代码添加到文档就绪 block 中，因为它仅在文档准备就绪后才执行您的代码。其次，将 onchange 事件与带有 id 数量的输入字段绑定(bind)并进行所有计算。请注意，您还应该进行一些验证，例如是否输入了一个单词或该字段是否留空等。