jQuery UI 1.8 新增了 position、button、autocomplete、新的 widget 工厂和更轻的核心
jQuery UI 团队很高兴地宣布 jQuery UI 1.8 的最终版本发布,其中包含 5 个新插件、1 个新效果以及数百个错误修复和改进。
我们非常努力地使 jQuery UI 变得更轻便、更模块化,并拥有更灵活、更可扩展的核心。现在,无论您使用 jQuery UI Widget 工厂、jQuery UI CSS 框架还是两者兼而有之,构建自己的 widget 或扩展我们的 widget 都变得更加容易。此版本是历时 9 个多月的集体努力,数百名开发人员、设计师、测试人员和用户都做出了贡献。感谢您一直以来的帮助和支持。在本文的最后,我们还会透露一些个人信息(我们会说出名字!)。
代码、主题、演示和文档现已在 jqueryui.com、jQuery UI 下载构建器、ThemeRoller 和 Google 的 AJAX 库 API 上发布。
注意:此版本包含重大(在某些情况下是破坏性的)更改。如果您当前使用或开发 jQuery UI 插件,请务必查阅 变更日志 和 升级指南,以详细了解这些更改及其影响。
下载 jQuery UI 1.8
我要全部
- jQuery UI 1.8 初始包 包含所有组件和我们的默认主题。它针对我们的 入门指南 进行了优化,以备您刚开始使用。
- jQuery UI 1.8 开发包 包含所有组件和我们的基础主题。它针对 jQuery UI 本身的开发或重新分发进行了优化,不适合入门。
- jQuery UI 1.8 主题包 包含 21 个 ThemeRoller 图库主题。如果您喜欢其中一个主题但想要进行调整,则每个主题都可以用作主题自定义的起点。
我知道我想要什么
- jQuery UI 1.8 下载构建器 可创建仅包含您选择的组件的自定义 zip 文件。它还会处理插件依赖项,因此您可以更轻松地进行操作。
我永远想要它
- jQuery UI 现已发布到 GitHub! 🙂 请随意 fork。
jQuery UI 1.8 中有哪些新功能?
此版本新增了两个新的实用程序、两个新的 widget、一个升级的 widget 工厂和一个更模块化的核心。有关 jQuery UI 1.7.2 和 jQuery UI 1.8 之间所有更改的完整列表,请参阅 1.8 变更日志。请参阅以下内容,了解一些较大且更明显的更改摘要。
Position 实用程序
相对于任何其他元素,甚至相对于窗口或鼠标,定位任何元素。秉承“少写代码,多做事情”的宗旨,它与选择您要定位的元素并指定其哪个部分应相对于另一个元素的哪个部分进行定位一样简单。就这么简单。
Button widget
Button widget 可从您可能用作原生按钮的任何可想象元素创建可主题化按钮。全面采用渐进式增强。现在,您的 <button> 将看起来与您的 <input type=”submit”> 和您的 <a class=”button”> 一样。我们更新了包含按钮的 jQuery UI widget(例如 Dialog),以便在您选择包含它时使用 button 插件。否则,它们将保持为原生按钮元素。再次感谢 PE,它尽可能地保持不显眼。感谢 Filament Group 找到了如何执行此操作的方法,感谢 Jörn Zaefferer 使其成为现实。当然,还要感谢整个社区在早期设计/开发以及之后的开发/测试过程中提供的反馈。我们对拥有漂亮的表单元素感到兴奋,而 button 是第一步。
Autocomplete widget
现在,您可以使任何文本输入弹出菜单,以帮助用户完成文本输入或搜索框,提供建议或允许的值。Autocomplete 的设计和构建基于流行的 Jörn Zaefferer 的 Autocomplete。与 button widget 一样,我们尽可能地保持 API 最小,同时提供必要的钩子,以便根据您的需求进行自定义。例如,您可以使用 source 选项提供静态本地数据,或者提供一个回调函数作为数据源,该函数可以处理通过 Ajax 从服务器获取数据。单个选项,重载。这是我们将来编写和重构所有 widget 的新方法,我们很高兴听到人们的看法。这是一个很大的变化,但应该保持库的精简,同时保持其尽可能的灵活和强大。请参阅 Autocomplete 演示以了解更多信息。
这是另一个新的插件,其实现工作主要归功于 Jörn Zaefferer,API 设计由 Jörn Zaefferer、Scott González 和 Richard D. Worth 完成。Filament Group 始终提供交互式设计以及静态标记和 CSS 参考。
新的 widget 工厂
Scott González 和 Jörn Zaefferer 在社区的帮助下,在此版本中对 jQuery UI Widget 工厂进行了重大更新。这些更改使创建和扩展您自己的 widget、扩展我们的 widget 或扩展其他人创建的 widget 变得更加容易。
注意:其中一些是破坏性更改,需要升级才能使用基于 1.7 widget 工厂构建的插件。有关这些更改及其影响的摘要,请参阅 升级指南中的 widget 工厂部分。
有关这些更改的另一个摘要以及我们为什么如此兴奋的原因,请参阅 David Petersen 的 这篇博文。感谢 David。
jQuery UI 核心缩小了 71%
最新版本的 jQuery UI 核心缩小了 71%。这种优化主要是通过提取原本模块化但打包在一起的组件 mouse 和 widget 实现的。
新的 mouse 插件文件使 jQuery UI 平均缩小了 14%
mouse 插件并不新鲜,但此版本将其移到了自己的文件 jquery.ui.mouse.js 中,之前它位于 jQuery UI 核心内部。这意味着,不依赖 mouse 插件但以前包含 jQuery UI 核心的 jQuery UI 插件现在需要包含的未使用代码更少,平均文件大小整体提升了 14%。这仅仅是平均值。有些改进高达 36%。
文件重命名
所有 .js 和 .css 文件都已重命名为以 jquery.ui. 前缀开头,而不是以 ui. 前缀开头。这是为了与 jQuery 插件命名指南保持一致,并为正在开发中的一些工具做准备,这些工具将允许轻松创建包含 jQuery 插件和 jQuery UI 插件的自定义构建。
注意:如果您编写自己的 jQuery 插件(即使是基于 jQuery UI Widget 工厂的),请遵循 jQuery 插件命名指南“jquery.{plugin-name}.js”,而不是“jquery.ui.{plugin-name}.js”。这将更轻松地区分属于和不属于官方 jQuery UI 库的 jQuery 插件。widget 命名空间和 CSS 类命名空间也是如此,当然,使用一般的 jQuery UI CSS 框架类除外。例如,如果您编写一个名为 foo 的 widget,则该文件应命名为 jquery.foo.js,而不是 jquery.ui.foo.js。该 widget 可以使用 ui-widget、ui-widget-content、ui-state-active 等类(请参阅 主题文档,以获取完整列表),但不应使用 ui-foo 和其他 ui-foo-* 类名,因为这些类将保留给 jQuery UI 库中的 foo widget 或 jQuery UI Foo widget,其文件名将为 jquery.ui.foo.js。
最新版 jQuery 1.4.2
jQuery UI 1.8 包含最新版本的 jQuery,即 1.4.2。它非常快。
如何升级?
- 下载 jQuery UI 1.8(请参阅上面的链接)
- 如果您要从 1.7 升级到 1.8,请务必遵循最新的 升级指南。如果您要从更旧的版本升级,则首先需要遵循传统的 1.7 升级指南。
- 最后,要了解 jQuery UI 在 1.8 中的每个部分都得到了哪些改进,您可以详细查看 变更日志。如果您最喜欢的错误尚未修复,请务必在我们的 错误跟踪器 或新的 开发 jQuery UI 论坛 中告知我们。
jQuery UI 1.7 怎么样?
jQuery UI 1.8 最终版的发布使其成为 jQuery UI 的最新稳定版本。这使得之前的版本 1.7.2 成为传统版本。jQuery UI 项目同时支持最新的稳定版本和一个传统的版本。因此,从现在开始,jQuery UI 下载构建器和 ThemeRoller 仅包含这些版本。任何早于 1.7.2 的版本都不再受支持,建议所有用户尽快升级到 1.8。
在尝试将传统的 jQuery UI 1.7.2 与最新的 jQuery 1.4.2 配合使用时,发现了一些问题。这些版本不兼容。传统的 jQuery UI 1.7.2 仅与 jQuery 1.3.2 兼容。即将发布的 jQuery UI 1.7.3 版本将使其与最新的 jQuery 1.4.2 兼容。这将是最后一个 1.7.x 版本,此分支将被冻结。
感谢
感谢所有帮助发布本版本的人,特别是:3li,4pcbr,abaumhau,aesnn,aflynt,ajpiano,akaihola,akshell,alab1001101,albertvo,alexch,allanm051,andreas,Andrew Powell,andrew.sharpe.7.9,Aneon,antonello.pasella,aron.duby,arunpjohny,ashish879,ask,attaboy,audreyt,AzaToth,babaker,BenBlank,bhornseth,bkrausz,bman654,BMCouto,bmherold,bobbykjack,bobmajdakjr,bohdan.ganicky,bornemix,Brant Burnett,brostbeef,burhan,Ca-Phun Ung,caesar2k,carltongibson,cfrerebeau,chaos,Chealer,Chi Cheng,chrisbarr,cjwilks,coeamyd,colinclark,conkey2,crankharder,crexland,cupdike,cyberdaz360,d.wachss,d3r1v3d,dantman,danw,darkprisma,david.brooks,davidascher,davidb,defenestrator,Demphest,dhlavaty,diogobaeder,DiRN,divide,dluk,dmethvin,dmfontz,dmuir,dohsun,doublerebel,dougneiner,doutu,dpeterman,dprunier,DRHansen,dtetto,duelli,dunghopper,ecaron,eib,epascarello,epiraux,erikharrison,ethan,FDisk,FelipeMorais,fgTodd,Flany,FreakCERS,geki007,george.adamson,glipman,gotmikhail,grabanski,graemeworthy,GreyCells,guile,haayman,hatapitk,idlesign,igor.morozov,Infarinato,itfische,ivanko,jabbott7,JBeckton,jdillmann,jeffgran,jollytoad,julian.jelfs,Jörn Zaefferer,kae,ke4roh,Keith Wood,kevin.wells,klarkin,Klaus Hart,kswedberg,lisaj,lnostdal,lunchtimemama,L_K_W,m4olivei,macarthy,Maggie Costello Wachs,marcoos,margustiru,martinkeimel,Matty,mawcs,mconway,mdiaz,menteb,mesoconcepts,mg,MikaJ,mikecapp,mikehostetler,Miroku_87,mkemmerling,mkornblum,moveax,MugeSo,mulhoon,mvermilion,neilski,nikolae,NJBR,nodster,ntoniazzi,obrie,patrick,Paul Bakaus,quasipickle,qwerty,ramaboo,raszi,rbracket,remi,rgluga,ricardolopezrey,Richard Worth,riegens,rnbguru,RobARichard,rsyring,Rwhitbeck,sam,Sancus,sc0rchin,SCCY,Scott González,Scott Jehl,sdavis,sebbacon,Sebmaster,seph429,sgorski,shartley,sherington,shuckster,slobo,smadep,snobo,sonu27,sosensible,spiralni,stakach,StevenBlack,TaeVjQuery,tan,Tgr,th3br41n,theojapa,thetoolman,tibi7000,timolastfm,togis,tomas,triblondon,trixta,uggedal,urkle,veronica,viraj.kanwade,vmx,vrn_shan,wakamolee,wewals,whydream,wichert,wimvl,Wolfjourn,xorax,xover,yourcelf,ZaDarkSide,ZeroMD,zeta,Zidane
@Dave – 每次升级时,请务必查看变更日志和升级指南,了解可能发生的任何相关更改以及您可能需要进行的更改。
我可以在哪里发布关于特定示例的一些问题?特别地,组合框示例缺少一些东西,并且有一些奇怪之处,我似乎无法解决。
@Anthony – 请访问 jQuery UI 使用论坛:http://forum.jquery.com/using-jquery-ui
Pingback: jQuery UI 组合框:深入了解 » 学习 jQuery - 提示、技巧、教程