标签: tinymce-4

使用TinyMCE 4进入onExecCommand事件

我正在使用TinyMCE 4,但文档很糟糕.我试图在另一个div(编辑器之外)中提供内容的实时预览.现在我正在听这些事件:

$(document).on('tinymce:changed tinymce:init', ...)
Run Code Online (Sandbox Code Playgroud)

这在输入文本时有效,但在执行命令时不会触发(例如,将现有文本更改为粗体).

看起来在TinyMCE 3.x中有一个onExecCommand事件可以完成我想要的事情.但我找不到任何关于如何监听全局jQuery事件的文档,就像我正在使用change和init一样.有谁知道它正在发射什么事件?

tinymce tinymce-4

6
推荐指数
1
解决办法
3250
查看次数

TinyMCE - 允许文本作为<table>和/或<tr>的直接子项

我一直在苦苦挣扎了大约3个小时,既测试解决方案又搜索了疯子.我还没有找到解决这个具体问题的方法.

问题: TinyMCE不允许我将文本作为直接"子"插入:

<table>
<tr>
<tbody>
Run Code Online (Sandbox Code Playgroud)

示例:我使用TinyMCE选项>源代码.
输入:

<table>
<tr></tr>
 *[generated]*
</table>
Run Code Online (Sandbox Code Playgroud)

我在源代码窗口按"确定"时,输出如下:

*[generated]*
<table>
<tbody>
<tr></tr>
</tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

会发生什么是TinyMCE将标记验证为无效并在表格外添加"text"([generated]).

为什么:我想要这个解决方案,因为cms引擎获取静态HTML并找到插入数据动态数据的特殊元素.数据将包含有效的HTML,之后生成的页面中不会存在我的[生成]标记.

我做了什么?我已经试了:

extend_valid_elements: "table[#text], table[text], tr[#text],tr[text]",
valid_elements:        "table[theader|tbody|#text|]",
valid_children:        "table[theader|tbody|#text]"
Run Code Online (Sandbox Code Playgroud)

我不能粘贴我一直试图允许的所有不同元素.但现在我没有想法.而且我不想为此做一个肮脏的黑客.

那里有谁可以帮助我吗?我的设置都是标准的,我刚刚添加了som插件.

verify_html:false,cleanup:false,

但无论做什么的插件/设置,我都会删除.

英语不是我的母亲,但我希望我能说清楚.

javascript jquery tinymce tinymce-4

6
推荐指数
1
解决办法
981
查看次数

TinyMCE:工具栏图标没有出现

我正在为我的一个项目探索微小的mce编辑器,我发现工具栏中的图标没有出现.它显示了一些浏览器无法显示的unicode.这是页面的html代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/ht/loose.dtd">
<html>
<head>
<title>HTML</title>
<script type="text/javascript" src="../js/tinymce/tinymce.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
tinymce.init({
        selector: "textarea",
        plugins: [
                "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker",
                "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
                "table contextmenu directionality emoticons template textcolor paste fullpage textcolor"
        ],

        toolbar1: "newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect",
        toolbar2: "cut copy paste …
Run Code Online (Sandbox Code Playgroud)

javascript tinymce tinymce-4

6
推荐指数
4
解决办法
2万
查看次数

关于IE 11的TinyMCE 4问题

我最近在网站上更新了一些管理系统,使用了JS版本来使用TinyMCE 4.我刚刚发现了一个只出现在IE11中的错误,如下所示:

当Textarea加载时,它包含已发布的html数据,但是在分裂秒之后TinyMCE需要触发,Textarea中的所有内容都被隐藏 - 而TinyMCE只是空的.

它似乎适用于所有其他浏览器,包括其他版本的Internet Explorer.有没有其他人有这个问题并知道解决方案?

干杯

tinymce internet-explorer-11 tinymce-4

6
推荐指数
1
解决办法
3280
查看次数

如何从tinymce 4.x中的窗口(弹出窗口)访问元素

我为tinymce编写了一个插件,该插件打开一个由URL加载的弹出窗口(它将弹出窗口创建为iframe)。当我单击此窗口中的按钮时,我想从此弹出窗口访问元素值(此元素是具有图像URL的锚标记),并将其作为图像加载到tinymce编辑器中。我怎样才能做到这一点?

我的插件代码:

tinymce.PluginManager.add('fileuploader', function(editor, url) {

    editor.addButton('fileuploader', {
        text: 'Upload Image',
        icon: false,
        onclick: function() {
            // Open window with a specific url
            editor.windowManager.open({
                title: 'Upload Image',
                url: 'http://localhost:8080/upload-file',
                width: 500,
                height: 100,
                buttons: [{
                    text: 'Done',
                    onclick: function(e) {
                        editor.insertContent('Title: ' + document.getElementById("fileUrl"));
                        top.tinymce.activeEditor.windowManager.close();
                    }
                }]
            });
        }
    });
Run Code Online (Sandbox Code Playgroud)

javascript iframe tinymce-4

6
推荐指数
1
解决办法
2913
查看次数

TinyMCE onchange_callback无效

<script>
    function TinyMceGetStatsLost(inst) {
        alert("The HTML is now:" + inst.getBody().innerHTML);            
    }


    tinymce.init({
        selector: "textarea",
        language: "ru",
        plugins: [
            "advlist autolink lists link charmap anchor",
            "searchreplace fullscreen",
            "insertdatetime paste"
        ],
        toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link",
        onchange_callback : "TinyMceGetStatsLost"
    });
</script>
Run Code Online (Sandbox Code Playgroud)

我使用此代码,但回调不起作用.在控制台我看不到错误......

请告诉我为什么回调不起作用?

javascript jquery tinymce callback tinymce-4

6
推荐指数
1
解决办法
2804
查看次数

TinyMCE 4无法输入提供的插件文本字段

在JS(使用JQuery 1.11.1和几个JQuery插件,如form和ui)下使用TinyMCE 4.1.5.我使用的TinyMCE版本不是嵌入式JQuery的版本.

编辑器很好,我可以直接输入它而没有问题.仅使用tinymce提供的插件,使用按钮或非文本字段控件的所有功能都可以正常工作.

但是,插件中的文本字段(例如链接或插入视频)不允许我键入字段或选择其他文本字段(因此它似乎是一个焦点问题).

http://fiddle.tinymce.com/bzeaab/16上有一个小提琴,这里是应用程序中更具体的初始化代码:

var _clear_css_cache;
_clear_css_cache = '/javascripts/canonical/tinymce/skins/lightgray/' +
                   'content.min.css?' +
                   new Date().getTime();

var _toolbar_1, _toolbar_2;
_toolbar_1 = 'formatselect, |, ' +
             'bold, italic, underline, strikethrough, ' +
                'subscript, superscript, |,' +
             'outdent, indent, blockquote, |,' +
             'alignleft, aligncenter, alignright, alignjustify';

_toolbar_2 = 'bullist, numlist, table, charmap, emoticons |,' +
             'link, unlink, |,' +
             'image, media, |,' +
             'code, preview |,' +
             'pasteword, print |,' +
             'undo, redo,';

var _contextmenu;
_contextmenu = 'link image inserttable | …
Run Code Online (Sandbox Code Playgroud)

javascript jquery tinymce tinymce-4

6
推荐指数
1
解决办法
1911
查看次数

TinyMCE 4将下拉菜单添加到菜单栏

我需要在TinyMCE 4中的"工具"项旁边添加另一个下拉菜单:

新物品

我找到的最接近的解决方案是:

// Adds a custom menu item to the editor that inserts contents when clicked
// The context option allows you to add the menu item to an existing default menu
tinymce.init({
   ...

   setup: function(ed) {
      ed.addMenuItem('example', {
         text: 'My menu item',
         context: 'tools',
         onclick: function() {
            ed.insertContent('Hello world!!');
         }
      });
   }
});
Run Code Online (Sandbox Code Playgroud)

但它只在已经存在的"工具"菜单中添加了一个项目.

javascript jquery tinymce tinymce-4

6
推荐指数
1
解决办法
7073
查看次数

更改windowManager TinyMCE上按钮的配置

我已经制作了一个文件管理器,用于在tinyMCE上上传图像,并从另一个文件(attachment_path)获取表单上传和图像列表。首先,我成功获取了图像网址,并field_name在选择图像时将其放置在该位置。但是现在我想在选择图像时将禁用按钮(Insert)更改为false,然后将图像的URL放入按钮(使用自定义属性)。

脚本index_path

file_browser_callback: function(field_name, url, type, win) {
        tinymce.activeEditor.windowManager.open({
          title: 'My File Manager',
          file: "<%= attachments_path %>",
          width: 450,
          height: 305,
          resizable : "no",
          inline : "yes",
          close_previous : "no",
          buttons: [{
              text: 'Insert',
              classes: 'widget btn primary first abs-layout-item',
              disabled: true,
              onclick: 'close',
              id: 'insertButton'
          }, {
              text: 'Close',
              onclick: 'close',
              window : win,
              input : field_name
          }]
        }, {
            oninsert: function(url) {
                win.document.getElementById(field_name).value = url; 
            },
            onselect: function() {
                // 
            }
        }); …
Run Code Online (Sandbox Code Playgroud)

javascript jquery file-manager tinymce-4

6
推荐指数
1
解决办法
4903
查看次数

如何更改TinyMCE 4的"删除格式"按钮面

删除格式的TinyMCE 4按钮是 在此输入图像描述,这对我来说当然不直观.我想让按钮面对更明显的东西,比如说通过,说给它分配一个图像.但我找不到任何改变按钮面的方法.分配给按钮的标记是

在此输入图像描述.

我不确定按钮上的Tx符号是如何获得的,但确实如此.

谢谢你的帮助.

css tinymce-4

6
推荐指数
1
解决办法
348
查看次数