使用TinyMCE编辑器在div上排序的jquery-ui导致文本消失 [英] jquery-ui sortable on divs with TinyMCE editors causes text to disappear

问题描述

按照以下说明进行操作: http://www.farinspace.com/multiple-wordpress-wysiwyg-visual-编辑者/

following the instructions at: http://www.farinspace.com/multiple-wordpress-wysiwyg-visual-editors/

我的metabox中有一些不错的所见即所得(WYSIWYG)编辑器

i've got some nice WYSIWYG editors in my metaboxes

我的标记如下:

 <div class="sortable">
 <div class="sortme">
<?php $mb->the_field('extra_content2'); ?>
        <div class="customEditor"><textarea name="<?php $mb->the_name(); ?>"><?php echo wp_richedit_pre($mb->get_the_value()); ?></textarea></div>
</div>
 <div class="sortme"
<?php $mb->the_field('extra_content3'); ?>
        <div class="customEditor"><textarea name="<?php $mb->the_name(); ?>"><?php echo wp_richedit_pre($mb->get_the_value()); ?></textarea></div>
</div>
</div>

这只是WP_alchemy(也来自farinspace.com)，用于包裹在div中的文本区域

which is just WP_alchemy (also from farinspace.com) for a textarea wrapped in a div

以及告诉tinymce插入的脚本:

and the script that tells tinymce to kick in:

function my_admin_print_footer_scripts()
{
    ?><script type="text/javascript">/* <![CDATA[ */

        jQuery(function($)
        {
            var i=1;
            $('.customEditor textarea').each(function(e)
            {
                var id = $(this).attr('id');

                if (!id)
                {
                    id = 'customEditor-' + i++;
                    $(this).attr('id',id);
                }
                tinyMCE.execCommand('mceAddControl', false, id);

            });
        });
    /* ]]> */</script><?php
}

// important: note the priority of 99, the js needs to be placed after tinymce loads
add_action('admin_print_footer_scripts','my_admin_print_footer_scripts',99);

那部分工作正常.但是当我尝试插入可排序的jqueryUI时:

that part works fine. but when i try to kick in jqueryUI sortable:

$('.sortable').sortable();

它使我可以对多个.sortme div进行排序，但是编辑器中的内容消失了.我怎样才能使文字持久?不需要tinymce编辑器，它就可以正常工作，所以我认为这是某种程度上的冲突.

it lets me sort the multiple .sortme divs, but the content in the editors disappears. how can i make the text persist? it works just fine w/o the tinymce editors, so I presume it is a conflict w/ that somehow.

推荐答案

此($('.sortable').sortable();)在tinymce编辑器中不起作用. Tinymce不喜欢被拖到dom周围.为了使其正常工作，您首先需要关闭Tinymce

This ( $('.sortable').sortable(); ) won't work with tinymce editors. Tinymce does not like being dragged around the dom. In order to make it work you first need to shut down Tinymce

tinyMCE.execCommand('mceRemoveControl', false, id);

然后排序，然后重新初始化

then sort and then reinitialize them

tinyMCE.execCommand('mceAddControl', false, id);

这篇关于使用TinyMCE编辑器在div上排序的jquery-ui导致文本消失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！