mfc 弹出ocx与页面相对_前端页面之食堂点餐页面

写在前面：

我是这一项食堂点餐系统的开发者，虽然现在准确的来说，他还只算一个前端页面，根本就不能算作一个项目。

这是我上周五晚上开始这个前端页面的规划图，虽然最后我添加了一些东西，但有整体框架，确实每一步都很有思路，不至于边想边做，冒冒失失。

完成这个页面总共用了我周末的两个下午，总计大约5个小时。

但这只是整体框架，有很多很多的小毛病，比如改bug，我前前后后用浏览器F12调试了十次有余，算上自己直接用肉眼排查的bug，大约总共20余次。还有对用户的一些非法点击，非法输入，非法乱搞进行响应等。

你是开发者，你必须要牢记你的客户会点击一切你页面的东西，会将一切可能的顺序颠倒或者排列组合，会随意玩弄你开发的东西。你开发的东西必须无懈可击，用户和你之间是攻与防的关系，你要接住他们可能的每一招。

所以解决这些小问题所花的时间，已经大于我搭建大框架的时间，总共用了我两天晚上还有今天早上大约6个小时时间。

但实际上，潜在的时间花费远不止这些，我需要在白天吃饭的间隙来思考用户到底会怎样做，我好来设定怎样的防。但直到现在，即使我已经乱搞这个页面很多次了，我也不敢确定用户做的每一步操作，我都能给予正确的反馈。所以，欢迎大家指出用户体验不好或者因为一些乱搞就出问题的地方，我将竭力修改。

页面设计：

主体页面468行代码，JavaScript和jQuery混合代码227行，HTML标签代码240行，不重复注释共计46处，使用IDEA工具进行开发。

文件内容：

一个主页面，名称：HTML_SYSTEM.html ，存放于src根目录下，直接浏览器打开就可，当然，你也可以用记事本打开，来啊，来改我的代码啊。放心，有注释的。

Src根目录下还有两个文件夹，一个叫做picture，存放页面所使用到的图片，一个叫做jQuery，存放jQuery框架代码。均最好不要删除。

页面介绍：

食堂点餐页面。早餐，午餐，晚餐，可以通过按钮来调整显示哪一餐，页面由于简洁性，只会完整显示一餐。

但根据6点到9点早饭，11点到14点午饭，17到20点晚饭。系统会根据当前时间来提供给你相对应的餐食界面，同时你只能点此界面的餐食，其他时间段对应餐食只能通过按钮来“看”，并不能点。

就像午饭时间，你只能点午饭，怎么能点早饭和晚饭呢？

当然，如果不在早饭，午饭，晚饭时间段里，你就只能“看”，不能点任何一餐。

下面就是点餐，你必须在相对应菜下面勾选对勾才可以在对勾框下面选择该菜品你点的数目，当然，这也是防止你误触导致点多了餐，我们当然不想背这个锅。

（数字框支持你输入，也支持你按旁边加减按钮。当然我做了手脚，你只能输入数字，而且最大值50，最小值0。你说你当然可以搞出无数值的数字框，这当然可以，不过，在我的代码中，我会把0好心的给你填充上）

你不用担心金额的计算，放心，左下角的金额会自动给你算好的。

如果你全部点好了，就可以提交了，在正式提交之前，你还有一次弹出是否确认的弹窗的反悔机会，你可以确认一下点的对不对，或者金额是不是太大或太少。

好啦，你可以肆意玩弄这个页面啦，记住搞完后点击重置按钮继续玩弄哦。

哦，对了，为了防止你在早上9点钟刚刚好掐点点早饭，下午2点钟掐点点午饭，晚上8点钟掐点点晚饭，我已经设置了整点刷新，so.....，你最好能在延迟的那一两秒完成点餐，否则提交按钮就会变灰哦。

谢谢客户大大玩弄我的界面，这是我的荣幸。

可能页面上东西太少了，不过对于程序来说，从无到有是难的，从1到多就是粘贴复制了哦。

链接（百度网盘）：

https://pan.baidu.com/s/1aIfGFbJYuhWOnv3qcX106Q​pan.baidu.com

提取码：1111