Fluqi让JQuery更简单
openkk 13年前
<p> <a href="/misc/goto?guid=4958329371483402623">Fluqi</a> 为 jQuery 提供了一个通用的<a href="/misc/goto?guid=4958329372283619022">微件(Widget)构造器</a>,让用户以可视化方式创建并定制 jQuery 微件,然后可以把生成的标记语言代码和 JavaScript 用在自己的应用中。它还提供 .NET API,其接口易于使用,而且可以在服务器端代码中配置 jQuery 控件。</p> <p> <a href="/misc/goto?guid=4958329372283619022">Fluqi 微件构造器</a>能让用户预览配置的微件,生成对应的 C# 和 HTML+JavaScript 代码。你可以选择在 ASP.NET 中使用,如果是其他 Web 框架可使用后者。</p> <p> 下面是 ASP.NET 中嵌入标记语言的例子:</p> <blockquote> <% <p>var ac = Html.CreateAccordion ("ac")</p> <p>.Options</p> <p>.SetCollapsible (true)</p> <p>.Finish ()</p> <p>.Events</p> <p>.SetCreateEvent ("return createEvent (event, ui);")</p> <p>.SetChangeEvent ("return changeEvent (event, ui);")</p> <p>.SetChangeStartEvent ("return changeStartEvent (event, ui);")</p> <p>.Finish ()</p> <p>.Panels</p> <p>.Add ("My Panel 1")</p> <p>.Add ("My Panel 2", true)</p> <p>.Add ("My Panel 3")</p> <p>.Finish ()</p> <p>;</p> <p>%></p> <p><%using (ac.RenderContainer ()) {%></p> <p><%using (ac.Panels.RenderNextPane ()) {%></p> <p>Proin ...</p> <p><%}%></p> <p><%using (ac.Panels.RenderNextPane ()) {%></p> <p>Morbi ...</p> <p><%}%></p> <p><%using (ac.Panels.RenderNextPane ()) {%></p> <p>Mauris ...</p> <p><%}%></p> <p><%}%></p> </blockquote> <p> 服务器端代码在运行时生成 HTML 和 JavaScript,开发人员还可以将生成的所有微件的 JavaScript 打包在一个文件中,以供下载(其中使用了另一个开源库 <a href="/misc/goto?guid=4958329373815697103">SquishIt</a>)。</p> <p> 本质上,Fluqi 是一个基于 .NET 的<a href="/misc/goto?guid=4958329374611260345">开源库</a>,使用 C# 类来对应 jQuery 微件,包括 Accordion、AutoComplete、DatePicker、Dialog、ProgressBar、PushButton、Slider 和 Tab,同时用呈现类为对应的 jQuery 微件生成标记语言和 JavaScript。这些类在 Fluqi 的网站上使用(用来以可视化方式配置 jQuery 微件),同时作为 .NET API 对外暴露。</p> <p> Fluqi 提供 <a href="/misc/goto?guid=4958329375413661040">Nuget Packag</a> 供大家使用,包括 ASP.NET MVC 和 Web Form 两种方式。</p> <p> <strong>查看英文原文:</strong><a href="/misc/goto?guid=4958329376216165638"><strong>Fluqi Makes JQuery Simpler</strong></a><strong> </strong></p> <div id="come_from"> 来自: <a id="link_source2" href="/misc/goto?guid=4958329377031187547" target="_blank">InfoQ</a> </div>