TinyMCE 验证给出错误：无法调用未定义的方法“getContent”答案

【问题标题】：TinyMCE validation gives error: Cannot call method 'getContent' of undefinedTinyMCE 验证给出错误：无法调用未定义的方法“getContent”
【发布时间】：2012-08-23 21:34:10
【问题描述】：

我有一个带有小 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。但我从 ti 问题标题中得到错误。
有什么帮助吗？
因此，验证有效。如果我删除 textarea 空检查并让颜色改变，它会改变。但问题是当文本区域有东西时，我点击提交区域先变成红色然后提交。
如果验证失败，是否有一些功能可以让我做点什么？

【问题讨论】：

标签： javascript jquery asp.net-mvc jquery-ui tinymce

【解决方案1】：

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

您似乎有时会使用activeEditor 而有时则不会，所以我已经标准化了代码，因此您始终依赖activeEditor - 这意味着我已经删除了触发错误的行.您似乎也在使用 tinymce 和 tinyMCE 之间切换，这可能不会引起问题，但最好避免......所以我也将其标准化。

没有看到更多其他代码和标记的设置方式，但是很难确切地知道发生了什么。我的更改能解决问题吗？

$('#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”和“tinyMCE”有什么区别？
@1110 - 不同之处在于定义变量和函数的方式。我对 JavaScript 的体验是，它的变量、函数和属性都取决于大小写。这意味着var abc=123; 是与var ABC=456; 或var AbC=789; 不同的变量（所有这些都可以同时存在于您的程序中）。我想如果您的代码没有对此抛出错误，那是因为 TinyMCE 可能将tinyMCE 和tinymce 定义为引用它的主要tinyMCE 对象的变量.. 即使是这种情况，但最好坚持一个用于代码可读性。

【解决方案2】：

如果您无法控制 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/

【讨论】：