TinyMCE验证给出错误:无法调用方法'getContent'的未定义

TinyMCE validation gives error: Cannot call method 'getContent' of undefined

本文关键字:方法 getContent 未定义 调用 验证 出错 错误 TinyMCE      更新时间:2023-09-26

我有一个带有微小mce的文本区域,我这样加载它:

$(document).ready(function () {
    tinyMCE.init({
        mode: "textareas",
        ...

此文本区域在表单中。我将表单提交按钮绑定到:

$('#btnSubmit').click(function() {
    tinymce.triggerSave();
    var editorContent = tinyMCE.get('Description').getContent();
    if (editorContent == '' || editorContent == null)
    {
        $(tinymce.activeEditor.getBody()).css("background-color", '#ffeeee');
        $(tinymce.activeEditor.getBody().parentNode).css("background-color", '#ffeeee');
        $(tinymce.activeEditor.getBody().parentNode).css("border", '1px solid #ff0000');
    }
});

在我的实体类中,我有Required属性
我的目标是在模型无效时使tinyMCE后台red。但我从题目中得到了错误
有什么帮助吗
因此,验证是有效的。如果我删除文本区域为空,请检查并保留颜色更改,它会更改。但问题是,当文本区域有东西时,我点击提交区域,首先变成红色,然后提交
如果验证失败,我是否可以采取措施?

在我看来,这听起来就像一个未定义的对象错误——代码无法解析这一行tinyMCE.get('Description').getContent();

你似乎在有时使用activeEditor,有时不使用,所以我已经标准化了代码,所以你总是依赖activeEditor——这意味着我已经删除了触发错误的行。您似乎还可以在使用tinymcetinyMCE之间切换,这可能不会造成问题,但最好避免。。。所以我也把它标准化了。

如果没有更多地了解其余代码和标记的设置方式,就很难准确地判断发生了什么。我的更改能修复问题吗?

$('#btnSubmit').click(function() {
  tinyMCE.triggerSave();
  var editorContent = tinyMCE.activeEditor.getContent();
  if (editorContent == '' || editorContent == null)
  {
    $(tinyMCE.activeEditor.getBody())
      .css("background-color", '#ffeeee')
      .parent()
      .css({
        "background-color": '#ffeeee',
        "border": '1px solid #ff0000'
      });
  }
});

如果您不能控制TinyMCE的init方法,那么您可以遵循此解决方案。

jQuery(document).ready(function($) {
    function myCustomSetContent( id, content ) {
        // Check if TinyMCE is defined or not.
        if( typeof tinymce != "undefined" ) {
            var editor = tinymce.get( id );
            // Check if TinyMCE is initialized properly or not.
            if( editor && editor instanceof tinymce.Editor ) {
                editor.setContent( text );
                editor.save( { no_events: true } );
            } else {
                // Fallback
                // If TinyMCE is not initialized then directly set the value in textarea.
                //TinyMCE will take up this value when it gets initialized.
                jQuery( '#'+id ).val( text );
            }
            return true;
        }
        return false;
    }
    function myCustomGetContent( id ) {
        // Check if TinyMCE is defined or not.
        if( typeof tinymce != "undefined" ) {
            var editor = tinymce.get( id );
            // Check if TinyMCE is initialized properly or not.
            if( editor && editor instanceof tinymce.Editor ) {
                return editor.getContent();
            } else {
                // Fallback
                // If TinyMCE is not initialized then directly set the value in textarea.
                // TinyMCE will take up this value when it gets initialized.
                return jQuery( '#'+id ).val();
            }
        }
        return '';
    }
    $(".class-to-update-content").on("click", function(e) {
        myCustomSetContent( "tinymce-editor-id", "New Content in Editor" );
    });
    $(".class-to-get-content").on("click", function(e) {
        $("div.class-to-display-content").html( myCustomGetContent( "tinymce-editor-id" ) );
    });
});

参考编号:http://blog.incognitech.in/tinymce-undefined-issue/