当我使用clone（）方法时，Select2的元素停止工作。我已经确认有必要使用方法＆＃34; select2（＆＃39; destroy＆＃39;）＆＃34;，但我仍然找不到问题。有人有任何提示吗？
这是使用select2（＆＃39; destroy＆＃39;）方法的示例，在刚刚再次初始化元素之后。
jQuery(document).ready(function($) {
$('.consultorio').find('select').select2({
width: '100%'
});
// Include new clinic group fields
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".consultorios"); //Fields wrapper
var item = $("#consultorio");
var add_button = $("#add_consultorio"); //Add button ID
var x = 1; //initial text box count
$('.num-clinic').html(x);
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(item).find('select').select2('destroy');
var new_item = $(item).first().clone(true).appendTo(wrapper);
new_item.find('input,select').val('');
new_item.attr('id', $(new_item).attr('id')+'_'+ x );
new_item.find('.num-clinic').html(x);
new_item.find('input,select').each(function(){
$(this).attr('id', $(this).attr('id')+'_'+ x );
})
$(item).find('select').select2({ width: '100%' });
$('select').select2({
width: '100%',
// language: 'pt-BR',
language: {
noResults: function (params) {
return 'Não encontramos sua localização. Por favor, tente novamente ou selecione a localidade mais próxima.';
}
}
});
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault();
$(this).parents('fieldset').remove();
x--;
})
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet"/>
<div class="consultorios" id="consultorios">
<fieldset class="consultorio py-sm-4" id="consultorio">
<div class="form-row">
<div class="col-md-6">
<legend>Consultorio <span class="num-clinic"></span></legend>
</div>
<div class="col-md-6 text-right">
<a class="remove_field" href="#"><img src="<?php bloginfo('template_url'); ?>/assets/images/icon-erase@2x.png" alt="Excluir"></a>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label class="sr-only" for="consultorio_nome">Nome do Consultório</label>
<input type="text" class="form-control required" name="consultorio_nome[]" id="consultorio_nome" placeholder="Nome do Consultório">
</div>
<div class="form-group col-md-4">
<label class="sr-only" for="consultorio_especialidade">Especialidade</label>
<select name="consultorio_especialidade[]" id="consultorio_especialidade" class="required">
<option value="" selected>Especialidade</option>
<option value="Especialidade 1">Especialidade 1</option>
<option value="Especialidade 2">Especialidade 2</option>
<option value="Especialidade 3">Especialidade 3</option>
</select>
</div>
<div class="form-group col-md-4">
<label class="sr-only" for="consultorio_valor_consulta">Valor da Consulta (Exemplo: R$ 100,00)</label>
<input type="text" class="form-control required" name="consultorio_valor_consulta[]" id="consultorio_valor_consulta" placeholder="R$ Valor da Consulta (Ex.: R$ 100,00)">
</div>
</div>
<div class="form-row">
<div class="form-group col-md-3">
<label class="sr-only" for="consultorio_cep">CEP</label>
<input type="text" class="form-control required" name="consultorio_cep[]" id="consultorio_cep" placeholder="CEP">
</div>
<div class="form-group col-md-5">
<label class="sr-only" for="consultorio_bairro">Bairro</label>
<input type="text" class="form-control required" name="consultorio_bairro[]" id="consultorio_bairro" placeholder="Bairro">
</div>
<div class="form-group col-md-2">
<label class="sr-only" for="consultorio_estado">Estado</label>
<select name="consultorio_estado[]" id="consultorio_estado" class="estado-ajax required">
</select>
</div>
<div class="form-group col-md-2">
<label class="sr-only" for="consultorio_cidade">Cidade</label>
<select name="consultorio_cidade[]" id="consultorio_cidade" class="cidade-ajax required">
</select>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-8">
<label class="sr-only" for="consultorio_endereco">Endereço</label>
<input type="text" class="form-control required" name="consultorio_endereco[]" id="consultorio_endereco" placeholder="Endereço (Ex.: Rua Alexandre Dumas, 1678)">
</div>
<div class="form-group col-md-4">
<label class="sr-only" for="consultorio_referencia">Ponto de Referência</label>
<input type="text" class="form-control required" name="consultorio_referencia[]" id="consultorio_referencia" placeholder="Ponto de Referência">
</div>
</div>
</fieldset>
</div>
<button class="btn btn-primary" id="add_consultorio">+ consultório</button>
答案 0 :(得分：0)
您必须在克隆之前先销毁select2，但.select2（'destroy'）无效。使用这个：
var cloneObj = $('.newRow tr').clone();
cloneObj.find("span.select2 ").remove();
cloneObj.find("select").select2();
$(".itemList tbody").append(cloneObj);