正在做的一个项目选择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. [ 转载 ] get和post的区别

    GET和POST两种基本请求方法的区别   GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二. 最直观的区别就是GET把参数包含在URL中,POST通过r ...

  2. dsu on tree题表

    dsu on tree,又名树上启发式合并.重链剖分,是一类十分实用的trick,它常常可以作为一些正解的替代算法: 1.DFS序+线段树/主席树/线段树合并 2.对DFS序分块的树上莫队 3.长链剖 ...

  3. hdu CA Loves GCD(dp)

    一道我想骂人的题,差点把我气炸了. 题意: 求一个数的集合中(非多重集,每个数只出现一次)所有子集的gcd的和.结果MOD10^8+7输出. 输入输出不说了,自己看吧,不想写了. 当时我真把它当作数论 ...

  4. mysql的checkpoint

    上一章的结尾我们留下了一个问题,就是在上一章所介绍的模型中,恢复管理器必须要通过全篇扫描整个undolog进行日志恢复,这样做显然是没有太大必要的,因为系统中断肯定是在最后几个事务受到影响,前面的事务 ...

  5. 吴恩达-coursera-机器学习-week1

    一.引言(Introduction) 1.1 欢迎 1.2 机器学习是什么? 1.3 监督学习 1.4 无监督学习 二.单变量线性回归(Linear Regression with One Varia ...

  6. LDO current regulator for power LED

    LDO current regulator for power LED Challenge You've got a power LED? Great! Build a flash light! Wh ...

  7. OpenOCD Debug Adapter Configuration

    Correctly installing OpenOCD includes making your operating system give OpenOCD access to debug adap ...

  8. Overclock STM32F4 device up to 250MHz

    http://stm32f4-discovery.com/2014/11/overclock-stm32f4-device-up-to-250mhz/ Let’s test what STM32F4x ...

  9. delphi services允许跨域访问

    delphi services允许跨域访问 unit WebModuleUnit1; procedure TWebModule1.WebModule1DefaultHandlerAction(Send ...

  10. Linux学习20-nohup挂后台启动django

    前言 django在linux上运行,一般在xshell远程连接后,是通过python manage.py runserver 0.0.0.0:8000启动服务.但是这样有个弊端,窗口关闭服务就停止了 ...