當其他文本框為空或用戶輸入零時，將文本框設置為零

Question

我這里有一張表格，該表格根據您輸入的數量自動計算總成本。

我的問題是，每次我嘗試刪除數量中的值時，先前數量中的總成本值仍然存在，而不是“ 0”。 我只希望它這樣響應：

如果數量文本框具有值，則總成本將計算並

如果用戶刪除數量值，則總成本將顯示為“ 0”。

任何幫助將非常感激！ 謝謝。

到目前為止，這就是我所擁有的。

的HTML

<table style="border:1px solid purple">
    <tr>
    <th style="font-size:9px;">COST</th>
    <th style="font-size:9px;">QTY</th>
    <th style="font-size:9px;">TOTAL</th>
    </tr>

    <tr id="Tr1">

    <td><input class="price" type="text" name="price[]" value="100.00"></td>
    <td><input class="qty" type="text" name="qty[]" ></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
    <tr id="Tr2">
    <td><input class="price" type="text" name="price[]" value="100.00"></td>
    <td><input class="qty" type="text" name="qty[]" ></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
    <tr id="Tr3">
   <td><input class="price" type="text" name="price[]" value="100.00"></td>
    <td><input class="qty" type="text" name="qty[]" ></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
    <tr id="Tr4">
   <td><input class="price" type="text" name="price[]" value="100.00"></td>
    <td><input class="qty" type="text" name="qty[]" ></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
</table>

的JavaScript

$(document).ready(function() {
    $(this).keyup(function() {
        var grandTotal = 0;
        $("input[name='price[]']").each(function (index) {
            var price = $("input[name='price[]']").eq(index).val();
            var qty = $("input[name='qty[]']").eq(index).val();
            var output = parseInt(price) * parseInt(qty);

            if (!isNaN(output)) {
                $("input[name='output[]']").eq(index).val(output);
            }
        });
    });
});

此處的示例： https : //jsfiddle.net/bqwnw9Lk/1/

Answer 1

下面是經過修改的jsvascript，請嘗試此操作。

    $(document).ready(function() {
    $(this).keyup(function() {
        var grandTotal = 0;
        $("input[name='price[]']").each(function (index) {
            var price = $("input[name='price[]']").eq(index).val();
            var qty = $("input[name='qty[]']").eq(index).val();

            if( qty == ""){
            output = 0;
            }
            else{
                var output = parseInt(price) * parseInt(qty);
            }


            if (!isNaN(output)) {

              $("input[name='output[]']").eq(index).val(output);


            }
        });
    });
});

如果您想將輸出字段保留為空，則您可以設置
輸出=“”而不是輸出= 0;