2015-06-29 48 views
0

我有以下代碼:TinyMCE的文本對齊按鈕不在線上編輯工作

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> 

,這是工具欄看起來怎麼樣:

tinymce toolbar

文本對齊按鈕和子彈列表按鈕,也縮進按鈕不起作用

這是怎麼回事?

回答

0

我還沒有嘗試製作一個p元素作爲編輯器,但這裏是我的代碼與textarea。關鍵是你使用了正確的選擇器和正確的模式。

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> 

我認爲,如果你使用的模式爲 '精確' 它應該工作,但我還沒有嘗試過; http://www.tinymce.com/wiki.php/Configuration3x:mode

+1

哦,你拯救了我的生命,我在這個問題上掙扎了很長時間,問題在於它不起作用,因爲我將編輯器應用到了p標記,我和ckeditor有同樣的問題,而且我想知道爲什麼所有的編輯不工作大聲笑。現在我將它應用於div父項並且它可以工作。非常感謝 – medBo

+0

沒問題。只是將其標記爲接受的答案。 –

+1

是的,當然,這是我之前發佈的另一個問題,你可以回答它,我提供50分的獎勵,你應得的:) http://stackoverflow.com/questions/31055735/ckeditor-toolbar-is-not - 完全顯示 – medBo