构造一个即时保存的编辑器（beta） 最近在写 - Assbbs
构造一个即时保存的编辑器（beta） 最近在写博客编辑器，希望做到文本框随时输入，随时保持这种效果。 如果用JS监测每输入一个字就保存一次，那样读写数据库过于频繁。 用30秒定时保存的话，不能确保即时性和可靠性。 于是查阅网上资料后，确定了如下方案： function save { if !presave {console.log \& 39;no…
构造一个即时保存的编辑器（beta） 最近在写博客编辑器，希望做到文本框随时输入，随时保持这种效果。 如果用JS监测每输入一个字就保存一次，那样读写数据库过于频繁。 用30秒定时保存的话，不能确保即时性和可靠性。 于是查阅网上资料后，确定了如下方案： function save { if !presave {console.log \& 39;notsave\& 39; ;return;};presave=false; //后面是提交数据到后台的代码 }; var text=document.getElementById \& 39;text\& 39; ; text.addEventListener \& 39;input\& 39;,function {presave=true;} ; text.addEventListener \& 39;change\& 39;,function {save ;} ; text.addEventListener \& 39;mouseout\& 39;,function {save ;} ; window.addEventListener \& 39;beforeunload\& 39;,function e {if presave {save ;var ask=\& 39;退出编辑？\& 39;; e || window.event .returnValue=ask;return ask;}} ; var presave=false; presave项是为了在文本没有修改时，不进行保存，从而减少读写。 剩下的几个监听项， input：启用预提交。 change：文本框失焦时保存。 mouseout：鼠标移出时保存。 beforeunload：退出页面时保存。询问退出编辑是为了在关闭时有充足缓冲时间，避免直接关闭造成代码无法执行。