javascript - 如何使用 JS/jQuery 检查 CK Editor 是否有输入？

Question

在我的应用程序中，有一个文本区域，我使用了 CK 编辑器。现在我想检查用户是否输入了一些内容(空格除外)。为此有一些方法。但对我来说没有任何作用。当我使用它时，它会抛出未定义的错误。

文本区域

<div class="form-group {{ $errors->has('template_content') ? 'has-error' : '' }}">
    {{ Form::label('template_content', 'Template Content') }}
    {{ Form::textarea('template_content', null, array('class' => 'form-control', 'id' => 'editor1', 
    'name' => 'editor1', 'required', 'data-error="Template content is required"', 'id' => 
   'templateContent')) }}
    {!! $errors->first('template_content', '<span class="help-block">:message</span>') !!}
    <div class="help-block with-errors"></div>
</div>

JS函数

var a = CKEDITOR.instances["editor1"].getData();

    if (a == '') {
        //code to execute
    } else {
        //code to execute
    }

错误

Uncaught TypeError: Cannot read property 'getData' of undefined

Answer 1

第一

    {{ Form::textarea('template_content', null, array('class' => 'form-control', 'id' => 'editor1', 
    'name' => 'editor1', 'required', 'data-error="Template content is required"', 'id' => 
   'templateContent')) }}

这里有两个id，你的textarea id是templateContent。删除 'id' =>
'模板内容'

其次，这不是一个观察者!，它不会实时更新您的信息。例如，您需要以某种方式触发它

<button id="test">get data</button>

$(document).ready(function() {
  $("#test").click(function() {
    var a = CKEDITOR.instances["editor1"].getData();

    console.log(a);
  });
});

单击按钮并检查控制台。