Question

这是发生了什么：

我正在构建一个应用程序（使用PHP，jQuery等），其中一部分允许用户使用CKEditor编辑网页的各个部分（页眉，页脚，主要内容，边栏）。

它的设置使每个可编辑位在右上角都有一个“编辑内容”按钮，点击后，在jQuery-UI对话框中启动一个CKEditor实例。用户完成编辑后，可以单击“更新更改”按钮，将编辑后的内容传递回主页并关闭Dialog / CKeditor。

除了一件事，这一切都很有效。如果有人插入任何JavaScript代码，包含在'script'标签中，使用CKEditor的Insert HTML Plugin或者转到CKEditor中的'Source'并将代码放在源代码中，一切似乎都没问题，直到他们点击'Update Changes'按钮。

JavaScript似乎正在正确插入，但是当点击“更改更改”时，而不是关闭Dialog并将脚本传回到它所属的div，而是我得到的是一个全白屏幕，只有JavaScript的输出。例如，一个简单的“Hello World”脚本会在左上角生成一个白色屏幕，其中包含“Hello World”字符串;对于更复杂的脚本，比如Aweber的API调用，生成一个简报注册表单，我得到一个全白屏幕，其中Aweber API调用的结果表单在屏幕中间完美呈现。

最令人困惑的部分之一是，在这些页面上，如果我点击“查看来源”，我绝对没有。空虚空虚。

这是我的所有代码，用于处理在jQuery-UI对话框中启动CKEditor实例，以及在单击“更新更改”按钮时将编辑后的数据传递回其关联的div：

$(function()
{
  $('.foobar_edit_button')
  .button()
  .click(function()
  {
    var beingEdited = $(this).nextAll('.foobar_editable').attr('id');
    var content = $(this).nextAll('.foobar_editable').html();
    $('#foobar_editor').html(content);
    $('#foobar_editor').dialog(
    {
      open:function()
      {
        $(this).ckeditor(function()
        {
          CKFinder.SetupCKEditor( this, '<?php echo '/foobar/lib/editor/ckfinder/'; ?>' );
        });
      },
      close:function()
      {
        $(this).ckeditorGet().destroy();
      },
      autoOpen: false,
      width: 840,
      modal: true,
      buttons: 
      {
        'Update Changes': function() 
        {
          // TODO: submit changes to server via ajax once its completed:
          for ( instance in CKEDITOR.instances )
            CKEDITOR.instances[instance].updateElement();

          var edited_content = $('#foobar_editor').html();
          $('#' + beingEdited).html(edited_content);
          $(this).dialog('close');
        }
      }
    });
    $('#foobar_editor').dialog('open');
  });
});

我各种各样的困惑。如果有人能指出我正确的方向，我们将不胜感激。

谢谢！

Answer 1

我在使用带有drupal的ckeditor时遇到了类似的问题。正如你所说，我可以在ckeditor中输入javascript，它似乎第一次工作。但是，当涉及到更新内容时，我的javascript似乎被打破了。有一点我注意到它似乎调整输出，特别是在任何时期之后插入一个空格。

我的解决方案是在添加或更新内容中的任何javascript时不使用ckeditor。

将JavaScript插入在jQuery-UI对话框中运行的CKEditor实例时出现问题

1 个答案: