使用jquery在动态基础上查找总计

时间:2016-10-13 05:07:08

标签: jquery

我正在生成动态文本框,并希望对所有文本框值执行求和操作,但它不起作用。

下面是我的代码

[HttpPost]    
public JsonResult MethodTest(string users)
             {
                 string jdata = users.ToString();
                 List<StockAllocate> stockData;
                 bool status = false;


                    JavaScriptSerializer jss = new JavaScriptSerializer();
                    stockData = jss.Deserialize<List<StockAllocate>>(jdata);
                     status = true;


                 return new JsonResult { Data = new { status = status } };
             }

1 个答案:

答案 0 :(得分:3)

您必须使用event委派技术将event侦听器绑定到动态生成的DOM元素,如:

$(document).on("blur", "input.kk", function() {

还需要在var inputs = $('.kk');处理程序代码中移动event,如下所示:

$(document).ready(function() {
  $("#btnadd").click(function() {
    i = $('#hdntxt').val();
    i++;
    $("#dynamicdiv").append('<br>Val' + i + ':<input type="text" class="kk" name="qty[]">');
    $('#hdntxt').val(i);
  });

  $(document).on("blur", "input.kk", function() {
    var total = 0;
    var inputs = $('.kk');
    $.each(inputs, function(input) {
      var num = parseInt(inputs[input].value, 10);
      total += (!isNaN(num)) ? num : 0;
    });
    $("#total").html(total);
  })
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id='dynamicdiv'>
  Val1:
  <input type="text" class='kk' name="qty[]">
</div>
<input type="button" id='btnadd' name="" value="ADD">
<input type="hidden" id="hdntxt" value="1">
<p>
  Total : <span id="total"></span>
</p>