如何使用jquery添加两个文本框值,并添加另外两个来自相同文本框的文本框

时间:2017-06-01 09:42:46

标签: javascript c# jquery asp.net

enter image description here这是简单的文本框我给出了值并添加它们![在此处输入图像描述] [2] 当我添加更多带附加查询的文本框时,总和不计算

[在此输入图像说明] [3]

THis is jquery code of iam apending two divs with Two ids and text boxes are also have there ids

1 个答案:

答案 0 :(得分:1)

使用jquery功能以更简单的方式实现复杂的东西......

它为Huge Library提供了许多功能和灵活性,可以在跨浏览器中执行代码

HTML

<div class="row">
  <button type="button" class="btn btn-success add-more">ADD MORE</button>
</div>
<div class="form-group" id="ele">
  <div class="row" id="item1">
    <div class="row">
      <input type="number" class="num1">
      <label>+</label>
      <input type="number" class="num2">
      <label>SUM</label>
      <input type="number" class="sum" readonly="true">
      <button type="button" class="btn btn-success remove">x</button>
    </div>
  </div>
</div>

JQUERY脚本

var item = $('#item1').html();
var cnt = 0;
$('.add-more').click(function() {
  cnt++;
  $('#ele').append("<div class='row' id='item" + cnt + "'>" + item + "</div>");
});
$(document).on('click', '.remove', function() {
  $(this).closest('.row').remove();
});
$(document).on('keyup', '.num1,.num2', function() {
  if ($(this).hasClass('num1')) {
    var num1 = parseInt($(this).val());
    var num2 = parseInt($(this).siblings('.num2').val());
    $(this).siblings('.sum').val(num1 + num2);
  } else if ($(this).hasClass('num2')) {
    var num2 = parseInt($(this).val());
    var num1 = parseInt($(this).siblings('.num1').val());
    $(this).siblings('.sum').val(num1 + num2);
  }
});

Check Demo Here