Question

我有以下代码：

$.each(pk2, function(i,value) {   
     $('#query_form_opt_'+cell+'_2')
         .append($("<option></option>")
         .attr("value", i+1)
         .text(value)); 

  });

我的问题是超时调用此代码，新元素会被追加。我需要做的是每次调用此代码时清除$('#query_form_opt_'+cell+'_2')（删除附加的人员）。

我尝试了$('#query_form_opt_'+cell+'_2').remove()，但它删除了整个div结构。 $('#query_form_opt_'+cell+'_2').val('')也没有做任何事情。

Answer 1

使用.empty()它只会删除子结构。

$('#query_form_opt_'+cell+'_2').empty();

Answer 2

remove接受selector过滤要删除的元素。

   $.each(pk2, function(i,value) {   
       var el = $('#query_form_opt_'+cell+'_2');
       el.remove('option');
       el.append($("<option></option>").attr("value", i+1).text(value)); 
   });

Answer 3

使用空$('#query_form_opt_'+cell+'_2').empty()而不是删除（）。 empty将清除子元素而不是元素本身。 https://api.jquery.com/empty/

此外，如果您不想一次又一次追加元素，您可以使用旗帜的概念

var flag=true;
$.each(pk2, function(i,value) { 
  if(flag){
     $('#query_form_opt_'+cell+'_2')
         .append($("<option></option>")
         .attr("value", i+1)
         .text(value)); 
   }
   flag=false

  });

jquery：删除附加的元素

3 个答案: