TinyMCE:工具栏图标没有出现
say*_*lee 6 javascript tinymce tinymce-4
我正在为我的一个项目探索微小的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 | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor image media code | inserttime preview | forecolor backcolor",
toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft",
menubar: false,
toolbar_items_size: 'small',
style_formats: [
{title: 'Bold text', inline: 'b'},
{title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
{title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
{title: 'Example 1', inline: 'span', classes: 'example1'},
{title: 'Example 2', inline: 'span', classes: 'example2'},
{title: 'Table styles'},
{title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
],
templates: [
{title: 'Test template 1', content: 'Test 1'},
{title: 'Test template 2', content: 'Test 2'}
]
});</script>
</head>
<body>
<form method="post" action="somepage">
<textarea name="content" style="width:100%"></textarea>
</form>
</body>
</html>
另一方面,如果我用脚本替换脚本
<script type="text/javascript" src="http://tinymce.cachefly.net/4.0/tinymce.min.js"></script>
我能够完美地看到所有图标.我已将tinmsce下载中js的所有内容添加到js文件夹中的我的web项目中.有没有人对这个问题有所了解？
小智 9
如果您使用上述 TinyMCE 5.3，则需要导入以下默认图标。
import 'tinymce/icons/default';
以下是参考资料：
当我升级到Angular 9时，我的图标停止显示。我不确定他们之前为什么或如何工作，但在我的情况下，修复很简单。我只需要确保将图标从 node_modules 文件夹复制到文件“资产”部分的输出中angular.json。
小智 5
我遇到了同样的问题，.htaccess 和其他东西对我不起作用......
...最后我发现我已经声明了
*{ font-family: fonts,fonts,fonts, sans-serif !important; }
我发现
“！重要的”
在 @font-face 将被忽略后，我的 css 全部被破坏。
在我的特殊情况下，它不显示 tinymce 的图标，在我删除 !important 后，一切正常。
所以首先检查你的常规 css 设置:)
希望这有帮助
好的，我让这个工作了。
仔细分析控制台错误后，我发现这是tinymce字体未下载的问题。
这基本上是 Mozilla Firefox 的 security.fileuri.strict_origin_policy 属性的问题，需要将其更改为 false 以放宽来源限制。现在我可以完美地看到这些图标了。
| 归档时间： |
|
| 查看次数： |
15851 次 |
| 最近记录： |