正在做的一个项目选择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. JAVAEE——宜立方商城14:项目部署规划、Tomcat热部署、反向代理的配置

    1. 学习计划 1.系统部署 2. 项目部署 2.1. 项目架构讲解 2.2. 网络拓扑图 2.3. 系统部署 2.3.1. 部署分析 e3-manager e3-manager-web e3-por ...

  2. 网络设备Web登录检测工具device-phamer

    网络设备Web登录检测工具device-phamer   为了便于管理和维护,大部分网络都提供了Web管理接口.Kali Linux提供了一款专用检测工具device-phamer.该工具可以批量检测 ...

  3. php模板引擎之featherview

    在纯php文件中不加php结束符是一个好习惯,php结束符仅用于在php与html混写时标示php代码结束. <? ?>是短标签,<?php ?>是长标签,在php的配置文件( ...

  4. PHP 合理配置实现文件上传及保存文件到数据库

    合理配置 php.ini 如何配置php.ini实现PHP文件上传功能.其中涉及到php.ini配置文件中的upload_tmp_dir.upload_max_filesize.post_max_si ...

  5. HDU5420 : Victor and Proposition

    以深度建立线段树,线段树父亲节点向儿子节点连边,然后用线段树合并可以得到任何一个点子树的线段树,只需向对应节点的线段树中的$O(\log n)$个点连边即可.为了保证连边关系不发生混乱,线段树需要进行 ...

  6. 刚刚看到 PNaCl, 这才是我一直期待的跨平台的好东西!

    http://code.google.com/p/nativeclient/ https://developers.google.com/native-client/overview

  7. HDU 4764 Stone (2013长春网络赛,水博弈)

    Stone Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  8. Processing an OS Descriptor request -- Remote Desktop Protocol

    Special processing on the client is needed when processing TS_URB_OS_FEATURE_DESCRIPTOR_REQUEST. The ...

  9. ubuntu中chown设置文件权限

    参考文献: http://yanwen.org/doc/chown.html http://www.cppblog.com/deercoder/articles/110129.html 可以通过ls ...

  10. [Deepin 15] 安装 Java 8、Git、Firefox、SafeEyes(定时提醒休息工具)

    一.安装 JDK 8 1.到官网,用 迅雷下载 安装包 (jdk-8u131-linux-x64.tar.gz) 2.解压放到目录 /opt/software/jdk 3.配置环境变量 sudo vi ...