Question

我写的是Tinymce扩展，扩展的目的是允许用户对文本做出评论。当我点击评论按钮打开我输入。我试图改变风格有宽度和更高，我可以，但它看起来不太好。附上代码和图片。

插件js

tinymce.PluginManager.add('comments', function(editor/*, url*/) {
  // Add a button that opens a window
  editor.addButton('comments', {
    title: 'comment',
    //text: 'My button',
    //icon: false,
    image: "https://cdn3.iconfinder.com/data/icons/pyconic-icons-1-2/512/comment-outline-silence-128.png",
    onclick: function() {
      // Open window
      editor.windowManager.open({
        title: 'write comment ',
        body: [
          {type: 'textbox', name: 'title', label: 'Post a Comment', value: "hello", height: 40,
width: 30}
        ],
        width: 800,
        height: 400,
        onsubmit: function(e) {
          // Insert content when the window form is submitted
          let div= document.createElement("span");
          div.style.backgroundColor="lightblue";
          div.innerHTML=editor.selection.getContent();
          let span= document.createElement("span");
          div.appendChild(span);
          span.innerHTML = e.data.title;
          span.classList.add ("comment");
          editor.insertContent(div.outerHTML);
        }
      });
    }
  });

的index.html

<!DOCTYPE html>
<html>
<head>
  <script src="/js/tinymce/tinymce.js"></script>
  <script>tinymce.init({ selector:'textarea', plugins: 'comments', toolbar: 'comments', content_css : '/js/tinymce/plugins/comments/styleComments.css' });</script>
</head>
<body>
  <textarea>Easy (and free!) You should check out our premium features.</textarea>
</body>
</html>

看起来不太好，除高度和宽度外，我怎样才能设计它。

谢谢大家

Answer 1

在你的身体里尝试用这种方式定义字段：

{
    type: 'container',
    label  : 'fit',
    layout: 'fit',
    minWidth: 160,
    minHeight: 160,
    items: [
          {type: 'textbox', label: 'textbox', value: 'Fit will take all the space available.'},
        ]
}

......或者这样......

{
    type   : 'textbox',
    name   : 'textbox multiline',
    label  : 'textbox multiline',
    multiline : true,
    value  : 'default value\non another line'
}

如何在tinymce上输入样式

1 个答案: