Question

我在jQuery中遇到了一个复杂的问题。我想在jQuery中计算一个静态输入字段和三个动态计算字段的值。

以下是用HTML

创建的输入法

 <input type="text" required name="prodeyo_3[]" class="form-control"/>
 <input type="text" id="somaponyJer" required name="somapony_jer[]"/>

我只想获得id=somaponyJer的价值。然后我想通过jQuery获取动态创建的输入的值。

      $(document).ready(function () {

        $(".addrowMushok18").click(function () {

            var n = ($('.row_append tr').length - 0) + 1;


            var tr = '<tr>\
                        <td>' + n + '</td>\
                        <td><input type="date" required name="transection_date[]" class="form-control"></td>\
                        <td><input type="text" required name="transection_details[]" class="form-control" /></td>\
                        <td><input type="text" required name="purchase_sales_statement[]" class="form-control" /></td>\
                        <td><input type="date" required name="purchase_sales_date[]" class="form-control" /></td>\
                        <td><input type="text" required id="newTreasuryDeposit" name="treasury_deposit[]" class="form-control" /></td>\
                        <td><input type="text" required id="newReyat" name="reyat_2[]" class="form-control" /></td>\
                        <td><input type="text" required id="newProdeyo" name="prodeyo_3[]" class="form-control" /></td>\
                        <td><input type="text" required id="newSomaponyJer" required name="somapony_jer[]" class="form-control" value/></td>\
                        <td><input type="text" required name="remarks[]" class="form-control" /></td>\
                        <td align="center"><span class="remove_row"><i class="fa fa-trash-o fa-2x text-danger" data-toggle="tooltip" data-placement="left" title="Delete!" ></i></span></td>\
                    </tr>';

          $(".row_append").append(tr);
         }); 
});

从这个动态创建的输入文件中，我想得到id="newTreasuryDeposit" , id="newReyat" id="newSomaponyJer"

的值

然后计算它们并插入由JQuery创建的id="newSomaponyJer"。

请帮忙。

Answer 1

你可以这样做。请注意，我已经添加了您发布的html中缺少的按钮和表格，因此请根据您的html进行更改。对于 caluclate 部分，我刚刚将插入的数字添加到一起，根据您的需要进行更改。

点击add按钮生成tr，填写上述ID的字段，点击calculate按钮。结果将显示在id = newSomaponyJer的字段中。

function calculateValue() {
  const $sj = document.querySelector('#somaponyJer');
  const $ntd = document.querySelector('#newTreasuryDeposit');
  const $nr = document.querySelector('#newReyat');
  const $nsj = document.querySelector('#newSomaponyJer');

  //do some calculation e.g. sum them
  const result = Number($sj.value) + Number($ntd.value) + Number($nr.value);
  $nsj.value = result;
}

$(document).ready(function () {

  $(".addrowMushok18").click(function () {
    var n = ($('.row_append tr').length - 0) + 1;
      var tr = '<tr>\
        <td>' + n + '</td>\
        <td><input type="date" required name="transection_date[]" class="form-control"></td>\
        <td><input type="text" required name="transection_details[]" class="form-control" /></td>\
        <td><input type="text" required name="purchase_sales_statement[]" class="form-control" /></td>\
        <td><input type="date" required name="purchase_sales_date[]" class="form-control" /></td>\
        <td><input type="text" required id="newTreasuryDeposit" name="treasury_deposit[]" class="form-control" /></td>\
        <td><input type="text" required id="newReyat" name="reyat_2[]" class="form-control" /></td>\
        <td><input type="text" required id="newProdeyo" name="prodeyo_3[]" class="form-control" /></td>\
        <td><input type="text" required id="newSomaponyJer" required name="somapony_jer[]" class="form-control" value/></td>\
        <td><input type="text" required name="remarks[]" class="form-control" /></td>\
        <td align="center"><span class="remove_row"><i class="fa fa-trash-o fa-2x text-danger" data-toggle="tooltip" data-placement="left" title="Delete!" ></i></span></td>\
      </tr>';
    $(".row_append").append(tr);
  });

  $('.calculate').click(calculateValue);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" required name="prodeyo_3[]" class="form-control"/>
<input type="text" id="somaponyJer" required name="somapony_jer[]"/>
<button class="addrowMushok18">add</button>
<button class="calculate">calculate</button>
<table>
  <tr class="row_append"></tr>
<table>

计算一个静态输入字段和三个动态创建的输入jQuery

1 个答案: