Question

我尝试使用CKEditor保存表单并添加自动保存功能意味着所有输入都将自动保存：

<script>
//hide preview box 
$('document').ready(function() {
    $('#preview').hide(); //Default setting
}); 

//save in db
function CKupdate(){
    for ( instance in CKEDITOR.instances )

        CKEDITOR.instances[instance].updateElement(); //fix texrarea update value

        CKEDITOR.instances[instance].on('key', function() { //auto save 
                $("#save").trigger('click');
            });

        $('#article-form').ajaxForm( { //submit form
        target: '#preview', 
            success: function() { 
                $('#preview').show('slow').delay(800).hide('slow');
            } 
        }); 
}
</script>

<form id="article-form" name="article-form" method="post" action="save.php">
    <textarea name="bodyContent" id="bodyContent"><?php echo $row['content'] ?></textarea>
    <script type="text/javascript">
    CKEDITOR.replace('bodyContent');
    </script>

    <button onClick="CKupdate()" id="save" />Save</button>
</form>

<span id="preview"></span>

我的问题是：

此自动保存CKupdate()（参考行 - ＆gt;评论//自动保存）仅在我按Save后触发按钮..如果我没有按save则不起作用。我不确定如何在用户按save之前运行此操作。
用户按下save后，每次用户都会触发保存功能在textarea中插入任何字符串，几秒钟后我的浏览器将挂起。我认为on('key',不能很好地运作，或者可能需要更改为其他内容。

实际上我尝试做的是使用CKEditor创建textarea并将值保存到db并为自动保存创建函数。

Answer 1

我很遗憾地说，但这看起来非常不优化。您是否意识到在第一次单击后，每次按键都会将“keypress”事件再次添加到编辑器实例中？就像现在按5键一样，你可以点击5次保存按钮。

为什么不将保存代码移到另一个函数，而不是让整个函数再次运行？像这样：

<script>
//hide preview box 
$('document').ready(function() {
    $('#preview').hide(); //Default setting
    for ( instance in CKEDITOR.instances ) {

        CKEDITOR.instances[instance].updateElement(); //fix texrarea update value

        CKEDITOR.instances[instance].on('key', function() { //auto save 
                $("#save").trigger('click');
            });

   }
}); 

//save in db
function CKupdate(){
    for ( instance in CKEDITOR.instances ) {

        CKEDITOR.instances[instance].updateElement(); //fix texrarea update value


        $('#article-form').ajaxForm( { //submit form
        target: '#preview', 
            success: function() { 
                $('#preview').show('slow').delay(800).hide('slow');
            } 
        }); 
    }
}
</script>

<form id="article-form" name="article-form" method="post" action="save.php">
    <textarea name="bodyContent" id="bodyContent"><?php echo $row['content'] ?></textarea>
    <script type="text/javascript">
    CKEDITOR.replace('bodyContent');
    </script>

    <button onClick="CKupdate()" id="save" />Save</button>
</form>

Answer 2

更改 CKEDITOR.instances [实例] .updateElement（）; 至 CKEDITOR.instances.content.getData（）; 使用Ckeditor版本3xx

使用CKEditor表单自动保存

2 个答案: