删除所有相关元素后,无法附加动态生成的文本

时间:2018-01-31 11:48:41

标签: jquery html append

我有一个Select元素,可根据所选值在其下生成动态html。

我在quarter ID之后追加之前删除了year类的所有元素,但它无效。

$('.selYear').change(function() {
  var years = $(this).val();
  $('.quarter').remove();
  var myHtml = '';

  if (years.length > 0) {
    for (var x = 0; x < years.length; x++) {
      myHtml += '<div class="form-group row justify-content-center quarter">';
      myHtml += '<label class="col-sm-4 col-form-label">' + 'Quarters' + ' ' + years[x] + '</label>';
      myHtml += '<div class="col-sm-4">';
      myHtml += '<select class="selQtr" name="quarters[]" multiple>';
      myHtml += '<option>Q1</option>';
      myHtml += '<option>Q2</option>';
      myHtml += '<option>Q3</option>';
      myHtml += '<option>Q4</option>';
      myHtml += '</select>';
      myHtml += '</div>';
      myHtml += '</div>';
    }
  } else {
    myHtml = '';
  }
  $('#year').after(myHtml);
  // $('.selQtr').selectpicker();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group row justify-content-center" id="year">
  <label class="col-sm-4 col-form-label"> Years :</label>
  <div class="col-sm-4">
    <select class="selYear" name="years[]" multiple>
    			<option>2016</option>
    			<option>2017</option>
    			<option>2018</option>
    			<option>2019</option>
    			<option>2020</option>
    			<option>2021</option>
    			<option>2022</option>
    			<option>2023</option>
    			<option>2024</option>
    			<option>2025</option>
    			<option>2026</option>
     </select>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

问题在于on duplicate key update插件。

删除了它的行,一切正常。