Kiosk Web App jQuery Implementation

Kiosk Web App jQuery Implementation

本文关键字:Implementation jQuery App Web Kiosk      更新时间:2023-09-26

我有一个相对简单的网络应用程序,它充当我目前正在修改的自助服务终端。 我最初的目标只是让它工作,但现在我正在尝试实施更优雅的方法。

基本背景信息:

  • 内容 - 所有内容都通过 php 来自数据库 - 要么响应 ajax 调用,要么直接使用 php 回显内容(大部分内容)。 这部分我已经修改了,虽然仍然不完美,但相当有效/灵活。
  • 信息亭的作用 - 我们的客户使用信息亭进行一项或多项调查。 表单通过验证后,将提交数据。 如果这是最后一次调查,则会话结束。 如果有更多的调查,他们将继续进行调查。

问题:我有一堆控制信息亭行为的jQuery事件处理程序。 基本上,该行为包括根据展台所处的状态显示/隐藏已在 DOM 中的元素。

  • 切换指令
  • 切换注销屏幕(提前结束调查)
  • 转到调查的下一个/上一个问题
  • 空闲计时器,显示自动注销警告(再次只是显示/隐藏而不是警报)
  • 如果回答不足,则显示遗漏的问题
  • 如果表单通过简单验证,则提交表单

添加的调查越多,我遇到的特殊情况就越多,jQuery似乎就越混乱。 仅由单选按钮组成的调查很容易(尽管代码仍然不优雅),但我似乎将那些具有问题管道(依赖于其他问题的问题)和文本响应的调查视为特殊情况,我希望我可以对 jQuery 采取更模块化/OOP 的方法。

我考虑过...

  • 原型
  • jQuery UI Widget Factory
  • 编写我自己的jQuery插件
  • 编写我自己的 JavaScript 类
  • 淘汰赛.js
  • 继续当前的jQuery方法,只是清理它

提前感谢您提供您的专业知识,并根据我的项目背景为我指明正确的方向。

Backbone.js将是解决此问题的绝佳方法。 这种方法将通过以下方式解决我的问题...

  • 将模型与视图分离
  • 利用继承,我可以创建具有标准行为和子类的基类,以实现某些调查元素的特殊行为
  • Backbone.js非常轻巧,"与其他人配合得很好"