前端学习（1043）:回车把数据存储到本地存储里面

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>todoList待办事项</title><script src="./js/jquery.min.js"></script>
</head><body><header><section><label for="title">ToDoList</label><input type="text" id="title" placeholder="添加ToDo"></section></header><section><h2>正在进行<span id="rodocount"></span></h2><ol id="todolist" class="demo-box"></ol><h2>已经完成<span id="rodocount"></span></h2><ul id="donelist"></ul></section><footer>Copyright &copy;2014 todolist.cn</footer><script>var todolist = [{title: '我今天吃了八个馒头',done: false}, {title: '我今天学习jq',done: false}, ];localStorage.setItem("todo", JSON.stringify(todolist));//本地的数组转换为json.stringfy();var data = localStorage.getItem("todo");console.log(typeof data);//获取本地存储数据需要把字符串数据转换为对象形式json.parsedata = JSON.parse(data);console.log(data);$(function() {//按下回车 把完整数据存储到本地存储里面$("#title").on("keydown", function(event) {if (event.keyCode === 13) {//先读取本地存储原来的数据var local = getDate();console.log(local);}})//读取本地存储的数据function getDate() {var data = localStorage.getItem("todolist");if (data !== null) {//本地存储里面的数据是字符串格式的return JSON.parse(data);} else {//返回一个数组return [];}}});</script>
</body></html>

运行结果

前端学习（1043）:回车把数据存储到本地存储里面相关推荐

【ReactJs+springBoot项目——租房】第3章：OSS存储图片+本地存储+ 房源列表查询+GraphQL入门
图片存储解决方案的分析阿里云OSS存储方案的实现本地存储方案的实现整合前端系统实现图片上传功能实现房源列表查询功能 GraphQL的入门 1.图片存储解决方案在新增房源中, ...
html5 本地批量存储,HTML5本地存储
什么是HTML5存储? 简单地说,它是一种让web页面在浏览器端本地化存储键值对的方式.跟cookies一样,即使你从网站导航到别的网站,关掉了浏览器的tab页,退出了浏览器,数据依然存在:与cook ...
html 页面存储,HTML本地存储
本地存储:通过本地存储(Local Storage),web 应用程序能够在用户浏览器中对数据进行本地的存储. 在 HTML5 之前,应用程序数据只能存储在 cookie 中,包括每个服务器请求.本地 ...
前端学习（1185）:数据响应式
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8" ...
前端学习（2547)：数据代理
前端学习（2942）：vue的本地注册
前端学习（2157）：webpack-dev-server搭建本地服务
前端学习（1047）:todolist删除数据2
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8" ...
前端学习（1046）:todolist删除数据1
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8" ...

前端学习（1043）:回车把数据存储到本地存储里面

前端学习（1043）:回车把数据存储到本地存储里面相关推荐

最新文章

热门文章