2

我有以下问题：

我为我的应用程序使用了超薄图像裁剪插件，但是在克隆 html 并重新初始化插件时遇到了一些问题。

我正在销毁对象，以便在克隆新字段后使插件正常工作。问题是我克隆时选择的图像正在被删除。有更好的方法吗？

html代码：

<div class="row">
        <div class="col-md-5">
            <div class="clone">
                <div class="row fieldset-content">
                    <div class="col-md-12">
                        <br>
                        <div class="form-group">
                            <input class="slim" type="file" name="slim[]" />
                        </div>  
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            <button class="add_field_button btn btn-warning">+ Add more fields</button>
            <button type="submit" class="btn btn-success" name="submit-normal">Save changes</button>
        </div>
    </div>

jQuery代码：

<script>
    $(document).ready(function() {  
        var options = {
            ratio: '4:3',
            label: 'Drop me here.',
            instantEdit:true,
            jpegCompression:true,
            size:{ 
                width: 640,
                height: 480,
            }
        }
        var cropper = $('.slim').slim(options);

         $(document).on('click', '.add_field_button', function (e) {
            e.preventDefault();
            //destroy in order to get it working after clone
            cropper.slim('destroy');

            $('.fieldset-content').first().clone().appendTo('.clone');
            $('.fieldset-content').first().find('.name').val('');

            var rmvBtn = $('.fieldset-content').last().find('.remove-button');
            //new instance
            $('.slim').slim(options);
        });
    });
</script>
4

0 回答 0