正在做的一个项目选择jquery作为前端js核心库。然后就想选一个基于jquery的ui库,然后悲催的事情发生了。

至于为什么使用jquery,一是因为不想为授权费用,而又不想引起可能法律纠纷;另一方面jquery也是所有最容易上手和流行的js库。

如果ext要用于商用就要付版权费,这个不行

dojo的文档实在是无语,虽然dojo很强大,但是入门门槛太高,学习曲线陡峭

至于其它的ui库组内也没人用过

于是就选了jquery

接下来找了几个基于jquery实现的ui库,大部分都是收费的,最终确定下来从easyui(后来听说easyui的授权许可与ext类似) ligerui和官方ui里面选一个

jquery ui的样式很难看,所以这次决定换一个别的ui库试试

easyui的layout嵌套有问题,怎么也解决不了,于是就决定使用ligerui。

ligerui的layout嵌套也有问题,不过我想了个办法绕过去了,会损失一些性能。

但是真正悲催的事情来了。

layout各个区域我试过了很多办法都加不上滚动条,center区域的div一通到底,有一部分跟bottom重叠了。grid的得到选择的数据行、添加数据等操作都不好使。而且各个组件提供的api与文档描述出入巨大,开放的api也不够丰富,方法和事件太少。

总之相当不好用,使用它就是噩梦。

最后终于在项目还没有进行太久的时候找机会重新使用jqueryui重构。

虽然jqueryui的样式太难看,但是它还是很好控制的,方法和事件也很丰富。样式难看可以找美工修改这不是大问题。

至于jqueryui没有的那些组件主要是tree、grid、layout、form、menu,前三个都在网上找到了专门的插件,后面两个准备自己实现。

tree推荐使用ztree,中国人自己开发的,网上评价很好,更新也很快。缺点是每次更新,api变化都挺大,一般不敢在项目中升级,否则恐怕要在用到ztree的地方改好多东西。

grid推荐使用jqGrid,大版本号已经升到4,搜索jquery grid、jquery datagrid排名第一,功能丰富,提供普通的datagrid treegrid和分组grid,还有分页条功能。

layout推荐使用jquery.layout。模仿ext的borderlayout实现,但是有很多差异。支持嵌套。样式比较难看,不过修改比较容易。

当时想图省事结果给自己找了大麻烦。

项目正在进入开发阶段之前,技术选型一定要做好,不能因为工期紧、压力大就草率为之。采用某个第三方组件之前必须关注下它的使用者都有哪些、文档丰富不丰富、授权协议、网上的评价如何。最后还要自己实现一些demo测试一下。否则可能会在开发过程中导致严重后果。

教训啊。

前端基于jquery的UI框架的更多相关文章

  1. 基于jquery的ui选择之路

    选定: 主框架:jqueryUi tree:ztree grid:jqGrid layout:jquery.layout 原由: 还有其他demo,ajax实现等参看连接: 正在做的一个项目选择jqu ...

  2. 基于Vue的Ui框架

    基于Vue的Ui框架 饿了么公司基于vue开的的vue的Ui组件库 Element Ui 基于vue pc端的UI框架 http://element.eleme.io/ MintUi 基于vue 移动 ...

  3. element-ui iview-admin 都是基于vue的ui框架

    element-ui iview-admin 都是基于vue的ui框架

  4. Unity——基于UGUI的UI框架

    基于UGUI的UI框架 一.Demo展示 二.关键类 MonoSingle 继承MonoBehaviour的单例基类:做了一些特殊处理: 保证场景中必须有GameInit名称的物体,所有单例管理器脚本 ...

  5. 基于vue的UI框架集锦

    前端框架百花齐放.争奇斗艳,令人眼花缭乱.大神们一言不合就整一个框架出来,另小白们无所适从.下面罗列了一些比较优秀的UI框架,Star多的大都是老牌劲旅,Star少的许多是后起之秀. (1)Eleme ...

  6. 基于Ant Design UI框架的React项目

    概述 这款基于React开发的UI框架,界面非常简洁美观,在这篇文章中我主要为大家介绍一下如何用Ant开始搭建React项目 详细 代码下载:http://www.demodashi.com/demo ...

  7. 移动端Rem适配(基于vue-cli3 ,ui框架用的是vant-ui)

    介绍postcss-pxtorem 是一款 postcss 插件,用于将单位转化为 remlib-flexible 用于设置 rem 基准值 1.安装lib-flexible(用于设置 rem 基准值 ...

  8. 基于vue 的 UI框架 -- Mint UI

    网址: http://mint-ui.github.io/docs/#!/zh-cn 官网: http://mint-ui.github.io/#!/zh-cn vue2.0实例: http://bl ...

  9. 基于Vue的UI框架element el-table表格的自定义排序

    html部分: <el-table-column prop="phoneCache" label="手机缓存包编号" align="center ...

随机推荐

  1. POJ3070 Fibonacci[矩阵乘法]【学习笔记】

    Fibonacci Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 13677   Accepted: 9697 Descri ...

  2. UOJ.52.[UR #4]元旦激光炮(交互 思路)

    题目链接 \(Description\) 交互库中有三个排好序的,长度分别为\(n_a,n_b,n_c\)的数组\(a,b,c\).你需要求出所有元素中第\(k\)小的数.你可以调用至多\(100\) ...

  3. preg_replace正则表达式的使用

    <?php $str="as2223adfsf0s4df0sdfsdf"; echo preg_replace("/0/","",$s ...

  4. BTrace housemd TProfiler

    http://blog.csdn.net/y461517142/article/details/26269529 http://calvin1978.blogcn.com/articles/btrac ...

  5. java高新技术

    一.静态导入: import static语句导入一个类中的某个静态方法或所有方法: 例子: 1.import static java.lang.Math.max; 只是导入了Math类中的max方法 ...

  6. ASP.NET Web API实践系列11,如何设计出优秀的API

    本篇摘自:InfoQ的微信公众号 在设计API的时候考虑的问题包括:API所使用的传输协议.支持的消息格式.接口的控制.名称.关联.次序,等等.我们很难始终作出正确的决策,很可能是在多次犯错之后,并从 ...

  7. C#各种泛型集合体验

    本篇体验除Queue<T>和Stack<T>之外的其它泛型集合. SortedList<TKey, TValue> SortedList<TKey, TVal ...

  8. jQuery把所有被选中的checkbox的某个属性值连接成字符串

    有这样的一个需求:对于一组checkbox,当点击每个checkbox后,把当前处于选中状态的checkbox的某个属性值取出来连接成字符串,并以逗号分开. html部分: <input typ ...

  9. 在ASP.NET MVC中使用Knockout实践02,组合View Model成员、Select绑定、通过构造器创建View Model,扩展View Model方法

    本篇体验使用ko.computed(fn)计算.组合View Model成员.Select元素的绑定.使用构造器创建View Model.通过View Model的原型(Prototype)为View ...

  10. quartz 2.0 与1.0功能对比

    日常开发来说,相对于1.0版,2.0版在使用上有以下几点需要注意的变化 变化一 比1.0多引用了C5.dll C5.dll 一个C#和其他CLI语言的泛型集合类..Net2.0及以上才可以使用.简介地 ...