设计模式:使用Javascript MVC构建工具栏

发布于 2024-12-28 19:28:01 字数 439 浏览 1 评论 0原文

所以我正在构建一个复杂的网络应用程序,其中一部分涉及工具面板的构建。

  • 工具面板将由按钮或子面板组成。
  • 每个按钮都应该附加一个操作 - 它可以单击或拖动到某处以提供功能
  • 有时,当单击面板上的按钮时,面板中会出现 工具栏上有很酷的东西:)
  • 随着应用程序的发展,新的按钮将会出现,
  • 我可能想更改按钮的顺序或将现有面板附加到不同的按钮,

我想使用 JQuery MX 设计整个应用程序。工具栏是应用程序的关键,将首先进行编码,因此我的目标是利用它的开发来学习如何使用我的第一个 MVC JQuery 应用程序。

任何人都可以提供有关如何启动这种野兽的起点吗?

我知道控制器是起点,并且被编码为 JQuery 函数,但不完全确定模型和视图将如何在 JQuery MX 中使用它

So I am building a complex web app, part of this involves the building of a tools panel.

  • The tools panel will be composed of buttons or subpanels.
  • Each button should have an action attached - it can either be clicked on or dragged somewhere to provide a function
  • Sometimes when a button is clicked on a panel will appear in the
    toolbar with cool stuff in it :)
  • As the app evolves new buttons will appear
  • I may want to change the order of the buttons or attach an existing panel to a different button

I want to design this entire app using JQuery MX. The toolbar is the crux of the app and will be coded first and so I aim to use the development of this to learn how to wield my first MVC JQuery app.

Can anyone offer a starting point regarding how to start this kind of beast?

I understand that the controller is the starting point, and is coded as one might a JQuery function but not entirely sure how models and views will work with this in JQuery MX

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

開玄 2025-01-04 19:28:01

我实际上构建了一个带有工具栏的 Web 应用程序,尽管不是使用 JavaScript MVC(我认为这不必要地复杂)。

构建一个配置文件,如 buttonName : actionName。控制器运行配置文件并将操作分配给按钮的单击事件。

我的工具栏非常小(大约十个按钮,尽管它们确实发生了变化),因此我将所有操作保留在一个控制器中,尽管每个操作只有几行,调用一个单独的插件。如果您有很多按钮,您可能希望将操作分离到不同的控制器中。

然后你就有了一个带有一组通用代码的插件,用于处理工具栏的视觉呈现 - 阴影、背景颜色、图标管理等。只需使用 addClass / removeClass,并使用 CSS 设置不同按钮状态的样式。对于 HTML,我为每个按钮制作了一个 '' 标签,因此它可以优雅地降级。

子面板只是表示层上的附加功能。

I actually built a webapp with a toolbar, though not in JavaScript MVC (which I thought was unnecessarily complicated).

Build a config file like buttonName : actionName. The controller runs through the config file and assigns the action to the button's click event.

My toolbar was quite small (ten buttons or so, although they did change), so I kept all the actions in one controller, although each action was only a couple of lines, calling a separate plugin. If you have lots of buttons, you might want to separate out the actions into different controllers.

Then you have a plugin with a set of generic code which handles visual presentation of the toolbar - drop shadows, background-colors, icon management, etc. Just use addClass / removeClass, and style the different button states with CSS. For HTML, I made each button an '' tag, so it degraded gracefully.

Subpanels are just additional functions on the presentation layer.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文