在单页面应用程序中使用浏览器“后退”按钮时，Ace Editor中的数据损坏

Question

我在使用TurboLinks的Rails应用程序中使用Ace Editor。每次加载页面时都会初始化编辑器（包括通过浏览器“后退”按钮加载页面时）：

$(document).on('turbolinks:load', function () {
    var editor = ace.edit("editor");
});

单击应用程序中其他页面的链接，然后单击浏览器的“后退”按钮时，编辑器字段已损坏。例如，如果编辑器中的数据是：

toto
tata

转到另一页后，数据（显示在编辑器的文本区域中）变为：

12tototataXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

如何防止在我的应用程序中发生这种情况？

Answer 1

我的解决方法如下（在每个turbolinks:load事件中执行，包括用户使用“后退”按钮时）：

1. 删除上一个编辑器div（仅在使用“后退”按钮时存在），类似$('#editor').remove()
2. 从永不编辑的隐藏div加载内容
3. 为编辑器添加新的div，其中包含要修改的内容（例如$('#foo').after( $ {content} )
4. 使用ace.edit("editor");
初始化编辑器