jquery-ui - jQuery UI - 真的这么乱吗

Question

我从服务器(管理内部网应用程序)呈现一个页面，然后我想要它的 jQuery UI 并使内容与所选的 jquery ui 主题保持一致。

以按钮为例

<button class="do-something">Logout</button>

jQuery UI 文档说不应该手动应用 ui-state-default 和其他 37 个 CSS 类(在服务器渲染时)，但在初始渲染时应该调用 $(selector).button()选择器可能只是“按钮”或“.nice-button”等。

这对我来说似乎有点臭，但我认为细粒度控制是有意义的，因为它不打算像 ExtJS 或 Sproutcore 等那样高级。

然后我想到我想到的图标按钮怎么样<button class="do-something ui-icon-arrow-e">Logout</button>打电话时 .button()它会检查是否存在此类并相应地呈现。然而，似乎必须做 button(icons { pri: 'blah'}}) .哎呀。

我是不是处理错了？似乎这里的代码味道混合了很多纯粹与 html 外部渲染相关的 JavaScript 语句？我什至没有考虑稍后通过 ajax 等注入(inject)的东西。

然后我想要一个面板，标题像 Accordion 一样，我最终不得不将大约 93 个 CSS 类转储到 div 和 h3 上以保持一致。然后我创建了自己的扩展 jQuery $ fn 扩展 .crmPanel()这基本上是 parent.addClass 43 和 parent.children('h3:first').addClass() 53次。看起来很乱

人们如何在 Intranet 应用程序中使用 jQuery UI，或者您只是纯粹使用该元素并手动执行其他操作？

(注意将任何与 CSS 类数量相关的数字除以 4)

Answer 1

jQuery UI CSS Framework 为一些 UI 元素(如选项卡、对话框等)提供了一个很好的基础。我们发现它缺乏，因此通常会添加另一个 CSS 文件来增强具有一些 CSS3 效果的标准 CSS，添加排版和网格系统。

结果是这样的: http://agiletoolkit.org/intro/engage

虽然它仍然基于 jQuery UI 主题，但它看起来不像那样。

当涉及到按钮时，我们有时使用 jQuery 但有时使用 CSS。在该特定示例中，使用了 CSS，在其他情况下使用了 (selector).button():

http://codepad.agiletoolkit.org/buttonpushing.html?b=devel

在面板和布局方面，与 ExtJS 相比，jQuery 几乎无能为力。此外，我不喜欢 JS 控制的布局，因为它们很慢而且不稳定。我认为 CSS 是一种可行的方法。