CKEditor和jQuery serialize()问题

Question

我遇到了jQuery serialize()函数的问题.

在上下文中,我打开一个表单并检查对其所做的更改,因此当表单加载时,我将数据序列化并将其分配给全局变量:

form_data.edit_initial = $('#edit-job-form').serialize();

这很好.

然后,当我点击按钮离开表单时,它会执行以下检查:

var start = form_data.edit_initial;
var end = $('#edit-job-form').serialize();

if (start == end) 
{ 
    // Do button action 
}
else
{ 
    // Open confirm dialogue 
}

无论如何.这两个序列化()函数的工作,但第二个已经转换撇号等成一系列数字和百分比符号(我可以安全地假定是省略号一些代码).

有什么想法吗？这意味着即使没有进行任何更改,对话框也会打开并呻吟表示表单已更改而未保存.

救命!

这是一些示例数据.

我正在使用CKEditor实例.

第一个结果的一部分:

&edit_time_digital=60&edit_desc=%3Cp%3E%0D%0A%09They'd+like+the+share+their+site+incase+people+want+to+see+their+entire+collection+of+furnature.%3C%2Fp%3E%0D%0A%3Cp%3E%0D%0A%09The+site+needs+the+following%3A%3C%2Fp%3E%0D%0A%3Cul%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Home+page%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Standard+pages%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Galleries+(By+category)%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Contact+page%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09News+listings%3C%2Fli%3E%0D%0A%3C%2Ful%3E%0D%0A%3Cp%3E%0D%0A%09It+should+be+a+very+simple+generator+build.%3C%2Fp%3E%0D%0A&edit_status=active` 

第二个:

&edit_time_digital=60&edit_desc=%3Cp%3E%0D%0A%09They%26%2339%3Bd+like+the+share+their+site+incase+people+want+to+see+their+entire+collection+of+furnature.%3C%2Fp%3E%0D%0A%3Cp%3E%0D%0A%09The+site+needs+the+following%3A%3C%2Fp%3E%0D%0A%3Cul%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Home+page%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Standard+pages%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Galleries+(By+category)%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09Contact+page%3C%2Fli%3E%0D%0A%09%3Cli%3E%0D%0A%09%09News+listings%3C%2Fli%3E%0D%0A%3C%2Ful%3E%0D%0A%3Cp%3E%0D%0A%09It+should+be+a+very+simple+generator+build.%3C%2Fp%3E%0D%0A&edit_status=active

Answer 1

正如您在原帖中的评论中所提到的,我假设您正在使用CKEditor并在您的jQuery ready函数中(或在您的文档加载后的某个地方)使用编辑器实例替换textarea.与大多数WYSIWYG编辑一样,CKEditor喜欢重新格式化传递给它的文本,使其成为有效标记,用HTML实体替换特殊字符,将内容包装在段落中等等.这意味着虽然你没有改变任何东西,但是并且重新格式化的内容可以是不同的.

编辑器实例的初始化被延迟,可能在您序列化表单后发生.即便如此,CKEditor与它所创建的(现在隐藏的)textarea没有很强的联系,你需要调用编辑器的updateElement函数来刷新所有更改.它通常在表单提交时自动执行,这就是您在提交处理程序中获取重新格式化内容的原因.

所以你只需要确保在第一次序列化之前调用updateElement函数,最好的位置是在编辑器加载之后.幸运的是,有一个事件,假设以下HTML标记:

<form id="myForm">
   <textarea name="test" id="myEditor">My random text</textarea>
</form>

jQuery就绪函数:

$(function(){
   function SerializeForm(){
      // Make sure we have the reformatted version of the initial content in the textarea
      CKEDITOR.instances.myEditor.updateElement();

      // Save the initial serialization
      form_data.edit_initial = $('#myForm').serialize();
   }

   // You might as well leave it here in case CKEditor fails to load
   form_data.edit_initial = $('#myForm').serialize();

   // Create editor instance    
   CKEDITOR.replace('myEditor');

   // Tap into CKEditor's ready event to serialize the initial form state
   CKEDITOR.instances.myEditor.on("instanceReady", SerializeForm);
});

Answer 2

谢谢!我和CKEditor textarea在很长一段时间里遇到了问题.如果没有在cakephp中提交,我无法改变价值.

但现在一切正常.我只好打电话updateElement之前serialize是这样的:

CKEDITOR.instances.SurveyBody.updateElement();
var formData = $("#surveyForm").serialize();