我正在使用TinyMCE 4,但文档很糟糕.我试图在另一个div(编辑器之外)中提供内容的实时预览.现在我正在听这些事件:
$(document).on('tinymce:changed tinymce:init', ...)
Run Code Online (Sandbox Code Playgroud)
这在输入文本时有效,但在执行命令时不会触发(例如,将现有文本更改为粗体).
看起来在TinyMCE 3.x中有一个onExecCommand事件可以完成我想要的事情.但我找不到任何关于如何监听全局jQuery事件的文档,就像我正在使用change和init一样.有谁知道它正在发射什么事件?
我一直在苦苦挣扎了大约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,
但无论做什么的插件/设置,我都会删除.
英语不是我的母亲,但我希望我能说清楚.
我正在为我的一个项目探索微小的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) 我最近在网站上更新了一些管理系统,使用了JS版本来使用TinyMCE 4.我刚刚发现了一个只出现在IE11中的错误,如下所示:
当Textarea加载时,它包含已发布的html数据,但是在分裂秒之后TinyMCE需要触发,Textarea中的所有内容都被隐藏 - 而TinyMCE只是空的.
它似乎适用于所有其他浏览器,包括其他版本的Internet Explorer.有没有其他人有这个问题并知道解决方案?
干杯
我为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) <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)
我使用此代码,但回调不起作用.在控制台我看不到错误......
请告诉我为什么回调不起作用?
在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) 我需要在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)
但它只在已经存在的"工具"菜单中添加了一个项目.
我已经制作了一个文件管理器,用于在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)