tinymce在加载时添加了额外的ul标签

时间:2018-11-20 03:00:04

标签: tinymce html-lists

这是我的问题简单明了。我有一个输入字段,其中包含以下确切数据:

<ul>
<li>test</li>
<li>test</li>
</ul>

在加载tinymce时,如果我查看它在其字段中的代码,则会显示此信息:

<br>
<ul>
<ul>
<li>test</li>
</ul>
</ul>
<br>
<ul>
<ul>
<li>test</li>
</ul>
</ul>

因此,正如您在加载时看到的那样,它会在字段中添加额外的ul标签和中断符。

现在这是我当前的配置(请注意,我确实拥有最新的tinymce版本4.8.5,但是对于我拥有的4.6.5版本,它也会发生这种情况):

tinyMCE.init({
            mode : "exact",
            elements : "ta_description, ta_restrictions",
            // General options
            forced_root_block : false,
            theme : "modern",
            width : "100%",
            height : "250px",
            menubar: false,
            toolbar1: "undo redo styleselect fontselect fontsizeselect | bold italic forecolor backcolor",
            toolbar2: "code image link table | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent",
            plugins: [
                "advlist autolink lists link image charmap print preview hr anchor pagebreak",
                "searchreplace wordcount visualblocks visualchars code fullscreen",
                "insertdatetime media nonbreaking save table contextmenu directionality",
                "emoticons template paste textcolor colorpicker textpattern moxiemanager"
            ]
        });

这引起了一个问题,因为每次我保存时,该过程都会重复,并且还会添加更多ul标签。这类似于为什么我禁用了force_root_block的原因,因为在保存时它会不断添加越来越多的<p>标签。现在,我发现将br标签标记为无效元素可以防止此行为,但是换行符需要用到这些标签,我提到这是因为我不确定这是否有助于缩小问题的范围。

注意:我没有使用wordpress。

更新:此配置最终对我们有用。

<script defer="defer" type="text/javascript">
        tinyMCE.init({
            mode : "exact",
            elements : "ta_description, ta_restrictions",
            // General options
            forced_root_block : 'div',
            invalid_elements : 'br',
            theme : "modern",
            width : "100%",
            height : "250px",
            menubar: false,
            toolbar1: "undo redo styleselect fontselect fontsizeselect | bold italic forecolor backcolor",
            toolbar2: "code image link table | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent",
            plugins: [
                "advlist autolink lists link image charmap print preview hr anchor pagebreak",
                "searchreplace wordcount visualblocks visualchars code fullscreen",
                "insertdatetime media nonbreaking save table contextmenu directionality",
                "emoticons template paste textcolor colorpicker textpattern moxiemanager"
            ]
        });
    </script>

1 个答案:

答案 0 :(得分:0)

如果我将您的内容加载到TinyMCE中,则看不到所有这些额外标签:

http://fiddle.tinymce.com/d4gaab/5

我怀疑在将内容加载到编辑器中或从编辑器中提取出来时,在内容的前/后处理中会引起某种情况。