html - KCfinder 返回的图像标签在 CKeditor 上不完整

Question

KCfinder 返回的图像标签在 CKeditor 上不完整，无法正确显示/保存。请注意，我正在使用内联 CKEditor 和 KCFinder 进行图像上传。

这是集成代码:

ckeditor/config.js

    config.filebrowserBrowseUrl = base_url+'/js/kcfinder/browse.php?type=files';
    config.filebrowserImageBrowseUrl = base_url+'/js/kcfinder/browse.php?type=images';
    config.filebrowserFlashBrowseUrl = base_url+'/js/kcfinder/browse.php?type=flash';
    config.filebrowserUploadUrl = base_url+'/js/kcfinder/upload.php?type=files';
    config.filebrowserImageUploadUrl = base_url+'/js/kcfinder/upload.php?type=images';
    config.filebrowserFlashUploadUrl = base_url+'/js/kcfinder/upload.php?type=flash';

在页面 HTML 上

<div id="page_body" contenteditable="true" class="full">...</div>

页面JS

<script type="text/javascript">
            CKEDITOR.disableAutoInline = true;           
            var editor = CKEDITOR.inline( 'page_body', {
                on: {
                    focus: function(event){
                        var data = event.editor.getData();
                        alert(data);
                    },
                    blur: function( event ) {
                        var data = event.editor.getData();
                        var page_id = <?php echo $this->uri->segment(3) ?>;
                        var page_link =$("#page_link").val();
                        $.ajax({
                            type: 'POST',
                            url: '<?php echo site_url('admin/dashboard/ajaxChangePageData') ?>',
                            data: { page_id: page_id, page_body: data,page_link:page_link },
                            beforeSend:function(){},
                            success:function(data){},
                            error:function(){ alert("Error"); }
                        });      

                    }
                }
            } );

        </script>

奇怪的是，我可以使用 KCFinder 浏览服务器/上传而不会出现任何错误，我什至可以从服务器选择图像，并且图像在内容中成功显示。但代码宽度高度信息在重新加载后不存在。我认为为图像创建的 html 不完整

在源代码模式下我看到了-

<img alt="" src="/gchalk/content/images/333(1).jpg"  300px; height: 224px;" />

如果我第二次对 div 进行一些更改，比如添加一些文本，情况只会变得更糟。图片丢失，处理成文字，上面这段代码显示为

在源代码模式下-

<img alt="" data-cke-saved-src="/gchalk/content/images/333(1).jpg" src="/gchalk/content/images/333(1).jpg" 300px;="" height:="" 224px;"="">

它在浏览器/编辑器上显示为 -

<img alt="" data-cke-saved-src="/gchalk/content/images/333(1).jpg" src="/gchalk/content/images/333(1).jpg" 300px;="" height:="" 224px;"="">

我一天都在撕头发，找不到解决办法。请帮我想出解决办法。

哦，为了记录，文本通过 ajax 帖子在 MySQL 中保存为“TEXT”，我很确定这不是问题，但仍然只是说!

我注意到图像标签在默认的 ckeditor(不是内联)中也被弄乱了。

Answer 1

可能影响代码输出的因素:

1- Magic Quotes使用 PDO 时。如果它们是打开的，请在你的 php.ini 中将它们关闭!他们被弃用了。我为什么要告诉你这个？会因为在你的源代码模式下你有 300px; height: 224px;" 当你存储它并显示它时你有 300px;=""height:=""224px;"=""

2- 你的 CKeditor 包。尝试下载并重新上传您的 Ckeditor(如果可能，请将其更新为最新版本)

除此之外，我没有发现您提供的代码有任何问题。祝你好运!