今天吃什么?点餐助手升级版- JS+HTML5

使用了HTML5的本地存储功能,不支持此特性的浏览器将无法使用本应用。建议使用Chrome,Firefox等浏览器。

if(!window.localStorage) {

alert("你的浏览器不支持本地存储所以无法使用此应用!");

return false;

}

var menu = [];

var timer;

var storage = window.localStorage;

if(!storage.length){

$(".menu .tip").show();

}else{

var menuList = "";

for(var i = 0; i < storage.length; i++){

menuList += "

"+storage.getItem(storage.key(i))+" ×";

}

$(".menu .list ul").html(menuList);

menuArray();

}

$("#btn").click(function(){

theSwitch();

});

$(window).keypress(function(event){

event.keyCode === 32 && theSwitch();

event.keyCode === 13 && menuAdd();

});

$(".menu .add .btn").click(function(){

menuAdd();

storage.length && $(".menu .tip").hide();

});

$(".menu .clr").click(function(){

if(window.confirm("确定要清空菜单?")){

$(".menu .list ul li").remove();

storage.clear();

$(".menu .tip").show();

menuArray();

}

});

$(".menu .list li span").on("click",function(){

if(window.confirm("确定要删除这个菜谱?")){

var me = $(this);

menuRemove(me);

storage.removeItem(me.parents("li").index());

}

});

function menuArray(){

var menuItem = "";

for(var i = 0; i < storage.length; i++){

menuItem += storage.getItem(storage.key(i))+",";

}

menuItem = menuItem.substr(0,menuItem.length-1);

menu = menuItem.split(",");

}

function rnd(){

var rnd = parseInt(Math.random() * menu.length);

$("#eat").text(menu[rnd]);

}

function start(){

clearInterval(timer);

timer = setInterval(rnd,20);

}

function stop(){

clearInterval(timer);

}

function theSwitch(){

if($("#btn a").text() === "停止"){

stop();

$("#btn a").text("重新选餐");

}else{

if(!storage.length){

alert("没有菜谱,添加几个吧!");

return false;

}

start();

$("#btn a").text("停止");

}

}

function menuAdd(){

var itemObj = $(".menu .add .item");

var newItem = itemObj.val();

var itemNum = storage.length + 1;

if(!newItem){

alert("请输入菜谱名称!");

return false;

}

storage.setItem("menu"+itemNum,newItem);

$(".menu .list ul").append("

"+newItem+" ×");

menuArray();

itemObj.val("").focus();

}

function menuRemove(me){

var m = me.parents("li");

m.remove();

storage.removeItem(m.attr("data-itemKey"));

!storage.length && $(".menu .tip").show();

menuArray();

}

点餐选择口味的html,今天吃什么?点餐助手升级版- JS+HTML5相关推荐

  1. python编程:实现自助点餐小程序,包括自定义菜单,点餐,账单,结算等功能

    [题目]实现自助点餐小程序,要求满足以下要求: 用户可以通过输入菜名和价格自定义菜单,并将定义的菜单显示出来.接下来,用户可通过输入菜单中菜品的名称进行点餐,,用户点餐完成后提交,显示出用户点餐后的账 ...

  2. c语言编程餐厅点餐系统,C语言实现餐饮管理与点餐系统.pdf

    C语语言言实实现现餐餐饮饮管管理理与与点点餐餐系系统统 本文实例为大家分享了C语言实现餐饮管理与点餐系统的具体代码,供大家参考,具体内 如下 一一..项项目目简简介介 1.本程序实现了用户的点餐功能, ...

  3. 【项目】基于SaaS的餐掌柜项目实战 阶段一 基于SaaS的餐掌柜项目实战 第1章 基础架构搭建 1 餐掌柜需求分析

    [项目]基于SaaS的餐掌柜项目实战 文章目录 [项目]基于SaaS的餐掌柜项目实战 阶段一 基于SaaS的餐掌柜项目实战 第1章 基础架构搭建 1 餐掌柜需求分析 1.1 餐饮行业分析 1.2 餐饮 ...

  4. 服药最佳时间的选择,千万不要乱吃!

    以下推荐吃药最佳时间的选择,希望以此为患者用药有所帮助 [摘要]:吃药是什么时候最好?这是很有讲究的,不同的药物在选择吃药时间也不尽相同,科学地掌握吃药时间可以大大提高药物疗效,同时可以减少不必要的毒 ...

  5. [选择困难症]晚饭不知道吃什么的看过来 转盘选晚饭

    链接放在这里 点击链接 源码链接这里

  6. 微信小程序在线点餐外卖小程序实现方法适合校园点餐毕业设计小程序(含代码解释)

    随着目前的外卖强势入驻,很多的店铺也自己开发了一个自己的在线点餐系统,为了方便顾客可以实时的看到该店铺的菜品,更方便的满足顾客无需走动即可点到自己想吃的饭菜! 开发了这款微信小程序主要包含功能:微信登 ...

  7. 基于html的网上点餐系统,一种基于客户端的网上点餐系统的制作方法

    本发明涉及互联网技术领域,具体为一种基于客户端的网上点餐系统. 背景技术: 互联网是网络与网络之间所串连成的庞大网络,这些网络以一组通用的协议相连,形成逻辑上的单一且巨大的全球化网络,在这个网络中有交 ...

  8. 外卖点餐列表滑动 微信小程序_外卖点餐微信小程序的详细解决方案

    随着移动互联网的发展,以及人们生活节奏的加快,工作生活之余,大家都习惯通过手机点餐.而这对于许多餐饮企业来说,就完全具备了通过长沙小程序开发,打造外卖点餐小程序的条件.那么接下来,创研科技就给大家谈谈 ...

  9. 扫码点餐小程序源码_扫码点餐小程序有什么用?怎么制作?

    现在小程序扫码点餐服务已经越来越普及,当用户需要点餐时,无需麻烦服务人员,只需扫描餐桌上或者海报上的小程序码,就能快速点餐下单.这样不仅节约了排队时间,也提高了商家自己的服务效率. 上线了小程序案例, ...

最新文章

  1. eclipse 中配置maven环境
  2. Machine Learning week 9 quiz: Anomaly Detection
  3. JavaScript:从此不再怕闭包
  4. C/C++ 通过初始化列表和构造函数内赋值初始化成员变量的区别
  5. ajax改变json指向,Ajax遍历jSon后对每一条数据进行相应的修改和删除(代码分享)
  6. Linux sudoers文件的写法
  7. 前端:JS/35/二级联动菜单,select对象,select对象的属性,option对象,option对象属性,实例:省份列表与城市列表的联动
  8. 习题3.11 表达式转换 (25分)
  9. python通配符搜索文件_Python 如何查找特定类型文件
  10. 【jQuery笔记Part2】01-jQuery显示隐藏切换动画侧边广告案例
  11. 收下这份实操案例,还怕不会用Jmeter接口测试工具?!
  12. 操作系统复习笔记--第十一、十二章 文件系统的实现与大容量存储结构
  13. 寻找AR中的Big Difference - v4.0 #AR指南
  14. oracle卸载msvcr71,msvcr71.dll丢失解决方法2则(附msvcr71.dll win7 64位下载)
  15. 通信基础笔记 ----奈奎斯特和香农定理
  16. DebugView 简单使用
  17. router vue 页签文字_vueRouter点击打开新页签
  18. 新鲜出炉 日常家用电器电磁辐射危险排行榜(iPad3 iMac)
  19. 网络教育要考计算机和英语作文,写一篇关于远程教育的英语作文关于远程教育的优缺点、利与弊和自己的观点。...
  20. 【含答案】心田花开:小学一年级语文上册期中试卷

热门文章

  1. unity用image做按钮,实现点击按钮,切换文字
  2. 【S32K学习笔记】PIT
  3. sklearn决策树之random_state splitter
  4. linux常用命令第三章
  5. ce是什么牌子的包_图腾越复古越时髦 DIOR、GUCCI、CE各大精品牌的值得收藏包包...
  6. vue手机端的调试神器
  7. java调用json转map_Java 把json对象转成map键值对的方法
  8. 纪念在IBM实习的这些日子
  9. PCB的板芯材料种类介绍与PCB的分类
  10. 工业相机影响曝光的因素