Javascript/Jquery计算动态文本框的形式

Javascript/Jquery calculate dynamic textbox form

本文关键字：文本 动态 Jquery 计算 Javascript      更新时间：2023-09-26

我得到了一个jquery代码来创建动态文本框。这是我的jquery代码:

    var rowNum = 0;
    function addRow(frm) {
    rowNum ++;
    var row = '<p id="rowNum'+rowNum+'">Tanggal: <input type="text" class="datepick" name="qty[]" id="date'+rowNum+'" value="'+frm.add_qty.value+'" readonly="readonly"> Harga: <input type="text" name="name[]" value="'+frm.add_name.value+'" readonly="readonly"> <input type="button" value="Remove" onclick="removeRow('+rowNum+');"></p>';
    jQuery('#itemRows').append(row);
    frm.add_qty.value = '';
    frm.add_name.value = '';
    }
    function removeRow(rnum) {
    jQuery('#rowNum'+rnum).remove();
    }
这是我的表单代码: 
   <div class="form-group">
   <label>Price Given</label>
      <div id="itemRows">                                
      <label class="strong">Date: <input type="text" name="add_qty" class="datepick" id="date[]" /> 
      Price: <input type="text" name="add_name" /> 
        <input onclick="addRow(this.form);" type="button" value="Add" />
     </div>
    </div>
<div class="form-group">
    <label>Total</label>
      <input type="text" class="form-control" name="total" id="total" />
    <button type="button" name="calculate">Calculate</button>
</div>

我的问题是，如何创建我的文本框'total'可以自动或可以计算(通过按下按钮计算)文本框'add_name'(价格)的总数?我希望有一个最简单的方法来做这个计算

请尝试此代码 

 $(document).ready(function(){
        $("input[type='text'][name='add_name']").change(function(){
            var sum = 0
            $("input[type='text'][name='add_name']").each(function(){
                sum = sum + parseInt($(this).val());
            });
            $("input[type='text'][name='total']").val(sum);
        });
    });
演示

试试这个

$('[name="calculate"]').on('click', function() {
    var sum = 0;
    $('[name="add_name"]').each(function() {
        sum += $(this).val();
    })
    $('#total').val(sum);
})
相关文章：