<script> var quill = new Quill('#editor-container', { modules: { formula: true, syntax: true, toolbar: '#toolbar-container' }, placeholder: 'Compose an epic...', theme: 'snow' }); $(function () { var timer = null; // 简单节流器 每隔三秒储存数据 function throttle() { if (timer == null) { timer = setTimeout(saveLocal, 3000); } else { return; } } $(".ql-editor").on("keydown", function () { if ($('.title input').val() != '') { throttle(); } else { alert("请先输入标题"); } }); var title = null; $('.title input').on({ 'focus': function () { title = $(this).val(); }, 'blur': function () { var new_title = $(this).val(); if ($.trim(new_title) != $.trim(title) && $.trim(title) != '') { Titlechange(title, new_title); } } }); //获取索引 geturl(); //当标题改变时 本地储存同步改变 function Titlechange(obj1, obj2) { var data = JSON.parse(window.localStorage.getItem('biji')); $(data).each(function (i, data) { if (data[0].title == obj1) { data[0].title = obj2; return; } }) window.localStorage.setItem("biji", JSON.stringify(data)); } //实时记录 笔记内容 function saveLocal() { clearTimeout(timer); timer = null; var $title = $('[name="title"]').val(); var $html = $(".ql-editor").html(); var content = [{title: $title}, {text: $html}]; if (window.localStorage.getItem("biji") == null) { window.localStorage.setItem("biji", JSON.stringify(new Array())); } else { var data = JSON.parse(window.localStorage.getItem("biji")); var flag = false; if (data.length != 0) { $(data).each(function (i, data) { if (data[0].title == $title) { data[1].text = $html; flag = true; return; } }) window.localStorage.setItem("biji", JSON.stringify(data)); } if (!flag) { data.push(content); window.localStorage.setItem("biji", JSON.stringify(data)); } } } }); //获取索引 function geturl() { var index = parseInt(location.href.split("?index=")[1]); if (index != null) { var data = JSON.parse(window.localStorage.getItem("biji")); $('[name="title"]').val(data[index][0].title); console.log(data[index][1].text); $(".ql-editor").html(data[index][1].text); } else { return; } } </script>
window.sessionStorage
window.localstorage
来自:https://blog.csdn.net/liangmaxmin/article/details/107673161
分类:
JavaScript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
· 如何调用 DeepSeek 的自然语言处理 API 接口并集成到在线客服系统