Question

我刚刚使用内联编辑获得了CKEditor 4。我想为我正在进行的网站做一个CMS。这就是我想要做的事情：

<div contenteditable="true">
//Site code
</div>
<button onclick="">Save</button>

我想有一个脚本可以保存和更新我想编辑的PHP文件。就像获取已编辑页面的内容一样，然后将其输入目标文件，如home.php。

我做了一些研究，但是我找不到一个只会更新文件的简单代码，就像这个“Save data to PHP / Mysql with inline edit in CKEditor”一样。当我测试它时，它不会更新，但它只是将文本放在div下，并且它不会更新文件。

注意：我是这个人的新手......

Answer 1

您应该记住客户端代码（如CKEditor with JavaScript）和服务器端代码（如PHP）的概念。

所以你需要做的是将编辑后的div发送回服务器上的PHP页面（可能是通过建议的链接提供的AJAX）并更新服务器（PHP）端的页面。

但是我个人会建议将内容存储在数据库中并从那里读取 - 直接更新PHP文件对安全性的影响非常大。如果你对过滤不是很严格，很可能你有一个远程代码执行缺陷，这意味着任何人都可以在你的服务器上执行PHP代码。

Answer 2

使用onsubmit事件，非常简单：

<!-- Wrap editor with form. -->
<form action="yourPHPaction.php" method="post" id="form">
    <!-- Your inline editor. -->
    <div contenteditable="true" id="editable"></div>    

    <!-- This textarea will hold data for POST request, it can be hidden. -->
    <textarea id="editorData" name="editorData"></textarea> 

    <!-- This little fellow submits the form. -->
    <button type="submit">Submit form</button>
</form>
<script>

    var textarea = CKEDITOR.document.getById( 'editorData' ),
        form = CKEDITOR.document.getById( 'form' );

    // Update textarea on form submit with editor data.
    form.$.onsubmit = function() {
        textarea.setValue( CKEDITOR.instances.editable.getData() );
    }

</script>

此外，目前，CKEditor团队开发了一种新型创建者，可以调用基于<textarea>的内联编辑器来简化此类过程。查看门票：https://dev.ckeditor.com/ticket/10280

如何使用内联ckeditor保存或更新php页面？

2 个答案: