在可排序的div上添加TinyMCE编辑器

Question

我正在尝试创建一个应用程序，通过拖动删除div并编辑它们，可以实时构建新闻稿。要使用jquery.sortable（）对div进行排序，这些div还包含一个TinyMCE编辑器。在拖动div之前哪个工作正常。我已完成此link 1和link 2 但我仍然无法做到这一点。

这是我的代码

标记：

<div class="container">
    <div class="sort-List">
        <li>
            <div class="edit-Text">
                <p>Div 1</p>
            </div>
        </li>
        <li>
            <div class="edit-Text">
                <p>Div 2</p>
            </div>
        </li>
        <li>
            <div class="edit-Text">
                <p>Div 3</p>
            </div>
        </li>
        <li>
            <div class="edit-Text">
                <p>Div 4</p>
            </div>
        </li>
    </div>
</div>

JS：

<!--Tiny Mce-->
<script>
    tinymce.init({
        selector: '.edit-Text',
        inline: true,
        menubar: false,
        plugins: "textcolor colorpicker",
        toolbar: ["undo redo | styleselect | bold italic | alignleft aligncenter alignright | forecolor backcolor"],
    });
</script>
<!--Tiny Mce-->    
<!--MAKE DIVS SORTABLE-->
<script>
    $(function () {
        $(".sort-List").sortable({
            cursor: 'move',
            start: function (e, ui) {
                $(this).find('.edit-Text').each(function () {
                    tinyMCE.execCommand('mceRemoveEditor', false, $(this).attr('id'));
                });
            },
            stop: function (e, ui) {
                $(this).find('.edit-Text').each(function () {
                    tinyMCE.execCommand('mceAddEditor', true, $(this).attr('id'));
                });
            },
        });
    });
</script>
<!--MAKE DIVS SORTABLE-->