使用抠像功能而不更改编辑文本

Question

我正在使用具有可编辑div的javascript函数keyup和用于将文本添加到可编辑div中的文本输入字段，因此我的代码工作正常，但最近我添加了CKeditor插件来编辑文本。

例如，如果我在输入字段键入功能工作中设置了文本，并且现在将这些文本设置为可编辑的div，那么我想在自定义后使用Ckeditor进行自定义，如果我想更改输入字段的文本而不是丢失编辑并返回默认样式。

Javasacript

$('#input1').keyup(function () {
    txt = $('#input1').val();
    $('#field1').text(txt);
});

HTML

<input type="text" id="input1">

<div id="field1" contentEditable='true'; ></div>

Answer 1

尝试使用以下内容：

$(document).on("keydown", "#input1", function() {
    txt = $('#input1').val();
    $('#field1').text(txt);
});

在线示例

编辑1：

如果要确保在更改div时也更新了初始input ，则应尝试以下操作：

$(document).on("DOMSubtreeModified", "#field1", function() {
   $('#input1').val($('#field1').text()); 
});

例如，尝试单击按钮或通过Firebug修改div's内容，然后查看input的更改方式。

我不会在您的情况下使用keyup ，而是根据您的要求进行更改。

在线示例