Question

我有一张表格，我需要在表格中实时内联计算商品服务税（商品服务税）

（GST =价格/ 11）

我已经设法使用以下脚本。
但是如果我点击

，它也需要改变

复选框（exc.GST）表示GST =价格的10％

和

复选框（GST Free）表示GST = 0

HTML表格：

<form class="form-horizontal" name="newItemForm" id="newItemForm" action="" method="post" enctype="multipart/form-data">
              <div class="form-group">
                <input type="text" class="form-control" name="itemName" id="itemName" style="text-transform:capitalize" placeholder="Enter Item Name" autocomplete="off">
              </div>
              <div class="form-group">
                <input type="text" class="form-control" name="price" id="price" placeholder="Item Price" onkeyup="calculateGST()" autocomplete="off"> 
              </div>
              <div>
                <label class="checkbox-inlibe">
                  <input type="checkbox" Value="incGST"> Exc. GST
                </label>
                <label class="checkbox-inlibe">
                  <input type="checkbox" Value="FRE"> GST Free
                </label>
              </div>
              <div class="form-group">
                <input type="text" class="form-control calGST" name="gst" id="gst" placeholder="GST" autocomplete="off" disabled>
              </div>
              <div class="form-group">
                <input type="number" class="form-control" name="unitsPerCTN" id="unitsPerCTN" value="" placeholder="Units Per CRT" autocomplete="off">
              </div>
              <div class="form-group">
                <input type="text" class="form-control" name="supplier" id="supplier" style="text-transform:capitalize" placeholder="Supplier" autocomplete="off">
              </div>
              <button type="submit" name="submit" id="submit" class="btn btn-success">Submit</button>
              <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
            </form>

SCRIPT：

<script>
function calculateGST() {
    var priceStr =document.newItemForm.price.value;
    if (!priceStr)
        priceStr = '0';
    var price = parseFloat(priceStr);
    document.newItemForm.gst.value = price / 11;
}
</script>

**注意：此页面上还添加了jquery。 **

Answer 1

您可以使用事件侦听器轻松完成此操作。由于您标记了jQuery，因此可以使用.on()方法。

示例：

$('form checkbox').on('change', function(evt) {
    if( $(this).is(':checked') ) {
        //checked
    }else {
        //unchecked
    }
});

$('form input').on('change', function(evt) {
    //do something
});

Jquery：计算实时表单输入，它也随复选框一起变化

1 个答案: