标签: tinymce

验证 TinyMCE 的空输入

我使用 TinyMCE 作为非常有效的 WYSIWYG 编辑器。

编辑器在功能上没有问题。当试图确定它是否为空时,问题就出现了。


问题

我需要验证 TinyMCE textarea 的输入,以确保在提交表单之前输入了一些内容。

我试过的

我发现在这个问题上,用户使用以下语句成功解决了这个问题

var editorContent = tinyMCE.get('tinyeditor').getContent();
if (editorContent == '')
{
    // Editor empty
}
Run Code Online (Sandbox Code Playgroud)

对我来说这是一个问题,因为不是返回空字符串,而是返回的字符串如下所示(虽然为空):

"<!DOCTYPE html>?<html>?<head>?</head>?<body>??</body>?</html>"
Run Code Online (Sandbox Code Playgroud)

我什至尝试像这样评估字符串

if (editorContent == "<!DOCTYPE html>?<html>?<head>?</head>?<body>??</body>?</html>")
{
    // Editor empty
}
Run Code Online (Sandbox Code Playgroud)

但它不捡起来

到目前为止的代码

function validateForm()
{
    var editorContent = tinyMCE.get('editor').getContent();
    if (editorContent == "" || editorContent == null)
    {
        // Add error message if not already present
        if (!$('#editor-error-message').length)
        {
            $('<span id="editor-error-message">Editor empty</span>').insertAfter($(tinyMCE.get('editor').getContainer()));
        }
    }
    else
    {
        // Remove …
Run Code Online (Sandbox Code Playgroud)

javascript jquery tinymce

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

关闭表格中的自动样式 [Tinymce]

由于没有更多的 Tinymce 论坛,如果我可以问有没有办法通过在源代码中添加 style="width: or height:" 来关闭表格功能。

谢谢

tinymce

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

通过在 tinymce 中显示来去除 &lt;![if !mso]&gt;

目前我使用的是非常旧的版本(2.8),tinymce现在我正在尝试将其升级到最新版本(4)。在那个过程中,我遇到了一些麻烦,主要的问题是<![if !mso]>在旧版本中隐藏的 html 查看器中显示,

我使用这个编辑器作为我的邮件编辑器,所以基本上我正在将响应式 html 邮件文本加载到编辑器中。但它<![if !mso]>在整个 html 查看器中都显示了这段代码,但没有解释为注释。

在此处输入图片说明

我使用的代码,(根据示例

tinymce.init({
  selector: 'textarea',
  height: 500,
  theme: 'modern',
  plugins: [
    'advlist autolink lists link image charmap print preview hr anchor pagebreak',
    'searchreplace wordcount visualblocks visualchars code fullscreen',
    'insertdatetime media nonbreaking save table contextmenu directionality',
    'emoticons template paste textcolor colorpicker textpattern imagetools codesample'
  ],
  toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent …
Run Code Online (Sandbox Code Playgroud)

html javascript tinymce tinymce-4

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

TinyMCE onsubmit 不会填充文本区域。

你能告诉我如何将表单上的所见即所得内容提交到相应的文本区域吗?

我对表单提交进行了 javascript 验证,但是当验证代码被触发时,编辑器 textareas 为空。所以我仍然收到错误“需要字段...”。我不明白 TinyMCE 如何处理这个问题,但这毫无意义。我的 js 验证事件侦听器位于脚本的最后,但 textareas 仍然是空的。

是否有一些触发器可以强制 TinyMCE 在提交时使用内容填充文本区域?

javascript forms tinymce onsubmit tinymce-4

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

如何禁用 elfinder 删除和编辑选项?

您好,我在 Laravel 应用程序中使用 elfinder。我无法从 elfinder 禁用删除选项。非常感谢任何帮助。

这是我的配置文件:

<?php

return array(

    'dir' => ['assets/uploads/news_upload'],

    'disks' => [

    ],

    'route' => [
        'prefix' => 'elfinder',
        'middleware' => array('web', 'auth'), //Set to null to disable middleware filter
    ],

    'access' => 'Barryvdh\Elfinder\Elfinder::checkAccess',

    'roots' => null,

    'options' => array(),

    'root_options' => array(

    ),

);
?>
Run Code Online (Sandbox Code Playgroud)

我无法禁用删除选项。

tinymce laravel elfinder

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

如何为 Wordpress 更改 TinyMCE 的默认字体

我在 SO 上看到了这个问题,但所有答案都没有具体说明如何改变它。

我的意思是:答案说“添加这个”,但他们没有说明在哪里,我的意思是,哪个文件和一个必须是火箭科学家才能弄清楚。

有人可以像我五岁那样解释一下,好吧,让它变成 3 ......我必须做的所有步骤才能摆脱臭名昭著的 Libre Franklin 字体并将 Helvetica 作为 wordpress 的 TinyMCE 编辑器的默认设置?

谢谢

wordpress tinymce

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

使用 jQuery/PHP 在 TinyMCE 中嵌入和渲染 Twitter/Instagram 帖子

我正在使用 PHP/CodeIgniter 创建一个网站。我在视图中有一个 TinyMCE 文本编辑器,想将 Twitter 或 Instagram URL 粘贴到编辑器中并使用该 URL,将其嵌入并在文本编辑器中呈现。例如:

Instagram 网址:https : //www.instagram.com/p/BeA2XEHjQJ5/?hl= en & taken-by =iamsrk

推特网址:https : //twitter.com/iamsrk/status/947915219648487424

在 WordPress 中,如果我只是将这些 URL 粘贴到文本编辑器中,它将转换并呈现​​它。我想要完全一样的东西。

php embed tinymce

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

如何在 angular5 组件中设置 TinyMCE-Angular init 配置而不是 HTML?

我已经安装了 tinymce angular包,我可以正常工作:

https://www.npmjs.com/package/@tinymce/tinymce-angular

但我希望更改组件内的初始化值,以便我可以从每个环境的配置加载皮肤链接等,而不是在 html 中对此进行硬编码。

我试过了:

import tinymce from 'tinymce/tinymce';
Run Code Online (Sandbox Code Playgroud)

并使用:

tinymce.init({
    skins: '/assets/skins'
});
Run Code Online (Sandbox Code Playgroud)

然而,这抱怨做一个 npm install @types/tinymce (我已经完成了,但它似乎没有识别这个包)

谁能建议我做错了什么?文档不是很好,经过无休止的搜索后,我似乎无法在线找到任何帮助。

注意:我正在将 /node_modules/tinymce/skins 中的皮肤复制到 /assets/skins 中,所以我只是想要一种能够指向该位置以便编辑器加载它们的方法

tinymce angular angular5

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

tinyMCE 编辑器将本地化路径设置为上传图像的 src

我已经设置 tinyMCE 来进行图像上传,它在编辑器中显示上传的图像,但是在检查编辑器 HTML 的源代码时,我可以看到 src 属性被设置为文件路径:

<img src="../../../api/images/1"/>
Run Code Online (Sandbox Code Playgroud)

我有一个 file_picker_callback,它将图像发布到我的后端服务器以保存图像,并在 tinyMCE 文档中指定的“位置”键中返回一个绝对 URL:https ://www.tiny.cloud/docs/configure/file -image-upload/#images_upload_url

但我不确定为什么无论提供绝对 URL,图像上设置的 src 都以“../../../”开头。

相关的 tinyMCE 配置:

  tinymce.init({
      file_picker_types: 'file image',
      file_picker_callback: function(cb, value, meta) {
        let tinyMCE = this;
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/*,.doc,.docx,.txt,.rtf,.odt,.pdf');

        input.onchange = function() {
          var file = this.files[0];
          var reader = new FileReader();
          reader.onload = function () {
            // Register the blob in TinyMCEs image blob registry.
            var id = 'blobid' + (new Date()).getTime();
            var …
Run Code Online (Sandbox Code Playgroud)

tinymce tinymce-4

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

AutoFocus TinyMCE Editor TextArea Inside Bootstrap Modal 当显示 Modal 时

所以我在我的项目中使用 TinyMCE 编辑器来处理我的所有文本区域。可以在此处找到有关 TinyMCE 编辑器的更多文档。

我有四个不同的按钮,但是让我们只关注一个按钮,我确信代码可以从一个按钮复制到其他按钮,因为我希望所有按钮都具有相同的功能。

这是按钮:

四个按钮

这些按钮会调出 Bootstrap v4 模式。可以在此处找到有关 Modal 的文档。模态示例如下。

引导模态

现在让我们只关注Reminders Modal。这显然是形式的一部分。当我调出模态时,我在自动聚焦 textarea 时遇到了问题。我正在将模态加载到页面上,但在激活之前保持隐藏状态,但单击按钮。我不是动态渲染这个模态,它是一个静态模态。

所以让我们回顾一下我的代码。请记住,我们此时只关注提醒按钮和模态,因此下面只会显示与该模态相关的代码。

注意:我使用的是 Laravel 5.6,我使用 Laravel Blade 将模态包含在页面中。这些信息不应该对这个问题的答案产生影响,只是说它只是为了以防万一它可能是相关的。

我还使用 Laravel Collective 来在页面上显示文本区域。可以在此处找到有关 Laravel 集体文本区域的更多文档。Laravel Collective 不再是 Laravel 框架的原生版本,因此这些信息也可能相关,但可能性很小。

@include('components.form.part.modals.reminder')
Run Code Online (Sandbox Code Playgroud)

模态(/resources/views/components/form/part/modals/reminder.blade.php)

<!-- Modal -->
<div class="modal fade" id="reminderModal" tabindex="-1" role="dialog" aria-labelledby="reminderModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="reminderModalLabel">Reminder</h5>
            </div>
            <div class="modal-body">
                {{ Form::textarea('reminder', null, ['class' => 'form-control', …
Run Code Online (Sandbox Code Playgroud)

javascript jquery tinymce twitter-bootstrap bootstrap-modal

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