Tinymce 对齐文本按钮不适用于内联编辑 [英] Tinymce align text buttons don't work on inline editing

问题描述

我有以下代码:

HTML:

<p id="edit">Lorem ipsum dolor sat amet, consectetur adipisicing elit, sed do eiusmod临时事件 ut laboure et dolore magna aliqua.Ut enim ad minim veniam，quis nostrud 练习 ullamco labouris nisi ut aliquip ex ea commodo结果.Duis aute irure dolor in reprehenderit in voluptate velit essecillum dolore eu fugiat nulla pariatur.例外 sint occaecat cupidatat 非proident, sunt in culpa qui offcia deserunt mollit anim id est Laborum.</p>

JS:

这就是工具栏的样子:

文本对齐按钮和项目符号列表按钮以及缩进按钮不起作用

这里出了什么问题?

解决方案

我没有尝试将 p 元素制作为编辑器，但这是我的带有 textarea 的代码.关键是你使用了正确的选择器和正确的模式.

HTML:

<div class="col-sm-12">@Html.TextAreaFor(m => m.MarketingInformation, new { @class = "form-control mceEditor" })

JS:

我认为如果您使用精确"模式，它应该可以工作，但我还没有尝试过；http://www.tinymce.com/wiki.php/Configuration3x:mode

I have the following code :

HTML:

<p id="edit">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

JS :

<script type="text/javascript">

    $(document).ready(function(){
        tinymce.init({ 
        inline : true,
        selector : 'p#edit'
        });
    });
</script>

and this is how the toolbar look like :

text align buttons and bullet list buttons and also indent button are not working

What's going wrong here ?

解决方案

I have not tried making a p element as an editor but here's my code with a textarea. The key is that you use the right selector and the correct mode.

HTML:

<div class="form-group">
    <div class="col-sm-12">
        @Html.TextAreaFor(m => m.MarketingInformation, new { @class = "form-control mceEditor" })
    </div>
</div>

JS:

<script type="text/javascript">
        tinymce.init({
            mode: "specific_textareas",
            editor_selector : "mceEditor",
            height: 100,
            plugins: [
                "advlist autolink lists link charmap print preview anchor textcolor",
                "searchreplace visualblocks code fullscreen",
                "insertdatetime table contextmenu paste textcolor"
            ],
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | forecolor backcolor"
        });

</script>

I think if you use the mode as 'exact' it should work but I have not tried that; http://www.tinymce.com/wiki.php/Configuration3x:mode

这篇关于Tinymce 对齐文本按钮不适用于内联编辑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！