JQuery通过Onblur输入值动态附加文本

Question

当我输入输入（1）时，它成功附加文本。但是当我擦除然后输入值并再次给出输入（2）然后它随着先前值（1 + 2 = 3）增加。其中循环计数的前一个值和当前值

   $(document).ready(function(){
    var i=0;
    $("#flatcount").blur(function() {
            var floor = (this).value;
                for(i=1;i<=floor;i++) {
                    $('#row').append('<p>This is appended text</p><br>');
                }
    });
});

Answer 1

你需要清空element.before，如$('#row').empty()

$(document).ready(function() {
  var i = 0;
  $("#flatcount").blur(function() {
    var floor = $(this).val();
    $('#row').empty() //empty
    for (i = 1; i <= floor; i++) {
      $('#row').append('<p>This is appended text</p><br>');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" id="flatcount">
<p id="row"></p>

Answer 2

使用此代码我认为它会起作用

$(document).ready(function(){
    var i=0;
    $("#flatcount").blur(function() {
               $("#row").empty();
               var floor = (this).value;
                for(i=1;i<=floor;i++) {
                    $('#row').append('<p>This is appended text</p><br>');
                }
    });
});