CKEditor 4 работает, но CKEditor 5 не работает - PullRequest
0 голосов
/ 05 февраля 2020

Это работает:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>CKEditor Classic Editing Sample</title>
    <!-- Make sure the path to CKEditor is correct. -->
    <script src="scripts/ckeditor/ckeditor.js"></script>
    <!-- this is with CKEDITOR 4 -->
    <script>
      window.addEventListener("load", function() {
        CKEDITOR.replace ('editor1');
      });
    </script>
</head>
<body>
    <form method="post">
        <p>
            My Editor:<br>
            <textarea name="editor1" id="editor1">&lt;p&gt;Initial editor content.&lt;/p&gt;</textarea>
        </p>
        <p>
            <input type="submit">
        </p>
    </form>
</body>
</html>

Но точно так же HTML, с изменением пути скрипта на CKEditor 5, <textarea> не заменяется:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>CKEditor Classic Editing Sample</title>
    <!-- Make sure the path to CKEditor is correct. -->
    <script src="scripts/ckeditor5-build-classic/ckeditor.js"></script>
    <!-- this is with CKEDITOR 5 -->
    <script>
      window.addEventListener("load", function() {
        CKEDITOR.replace ('editor1');
      });
    </script>
</head>
<body>
    <form method="post">
        <p>
            My Editor:<br>
            <textarea name="editor1" id="editor1">&lt;p&gt;Initial editor content.&lt;/p&gt;</textarea>
        </p>
        <p>
            <input type="submit">
        </p>
    </form>
</body>
</html>

I скачал zip-файл CKeditor 5 и распаковал его по указанному пути. Во втором случае консоль ошибок chrome показывает:

Uncaught ReferenceError: CKEDITOR is not defined

Чего мне не хватает?

1 Ответ

0 голосов
/ 06 февраля 2020

Итак, в конце концов я нашел соответствующую статью на веб-сайте CKEditor: https://cdn.ckeditor.com/#ckeditor5

Для API v5 требуется другой синтаксис:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>CKEditor Classic Editing Sample</title>
    <!-- Make sure the path to CKEditor is correct. -->
    <script src="https://cdn.ckeditor.com/ckeditor5/16.0.0/classic/ckeditor.js"></script>
    <script>
    window.addEventListener("load", function() {
      ClassicEditor
           .create( document.querySelector( '#editor' ) )
           .then( editor => {
                   console.log( editor );
           } )
           .catch( error => {
                   console.error( error );
           } );
    });
    </script>
</head>
<body>
  <div id="editor">This is some sample content.</div>
</body>
</html>

Возможно это только я, но я думаю, что базовое руководство по началу работы может быть лучше. Я также получал ошибки с v5, пока не поместил код инициализации в прослушиватель событий.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...