javascript - 克隆部分的按钮无法正常工作

Question

我是 jquery 脚本的新手。我设法动态克隆表单的一个部分，但在克隆部分中显示 ckeditor 的 div 的按钮不起作用。它仍然监听原始部分中的按钮，并且仅在单击原始按钮时显示 ckeditor 的 div(但无法编辑除原始部分之外的所有内容)。这是我的代码:-

for(i=num; i<value; i++){
    var newSlot = $('#slot' + i).clone().attr('id','slot' + (i+1));

    newSlot.find('.heading-slot').attr('id', 'ID' + (i+1) + '_slot').html('Slot ' + (i+1)); //add new slot name

    newSlot.find('.other_message').hide();
    newSlot.find('.select_instruction').on('change', function () {  
        $(this).next('.other_message').toggle((this.value) == "Other")
    });


    newSlot.find('.extra_instruction').hide();
    //the button here is not working as I wanted
    newSlot.find('.btnAdditional').on('click', function(){
        $(this).next('.extra_instruction').show();
    });

    $('#slot' + i).after(newSlot);
}

html代码

    <div class="col-sm-6">
        <button type="button" id="btn_Additional" name="btn_Additional" class="btnAdditional btn btn-info">Additional Instruction</button>
            <div class="extra_instruction">
                <textarea id="input_add_instruction" name="add_instruction[]" class="form-control"></textarea>
<script>CKEDITOR.replace( 'input_add_instruction' );</script>
            </div>
    </div>

有人可以指导我吗？请我对此很陌生。提前致谢..

Answer 1

克隆函数不仅克隆 html，还克隆事件监听器，而不是克隆，尝试创建元素并正确添加事件监听器。