未完待续
在做敏捷开发时, 除了公司自己造的轮子外, js组件是会被经常使用到的轮子, 下面就项目(电商项目, 管理类项目)中经常使用到的js组件做一个整理.
目录
- jquery.jsonp
- jquery.blockui
- jquery.uniform
- jquery.layout
- jquery.cookie
- jquery.validate
- jquery.form
- jquery.transit
- jquery.bxslider
- jquery.qrcode
- jquery.chosen
- jquery.select2
- jquery.backstretch
- jquery-siderbar
- jquery-autocomplete
- jquery.slimscroll
- jquery.jqzoom
- jquery.imgScroll
- jquery.metadata
- jquery.lazyload
- jquery.fancybox
- jquery.poshytip
- jquery.raty
- OwlCarousel
- jquery-contextMenu
- jquery-timeago
- jquery-sessionTimeout
- jquery.toastr
- jquery.cubeportfolio
- jquery.countdown
- jquery.dataTables
- jquery.gritter
- icheck
- ion.rangeSlider
- jquery.Jcrop
- jquery.color
- jquery.bootpag
- jquery.pagination
- jquery.idletimer
- jquery.inputMask
- jquery knob
- jquery.minicolors
- mixitup
- Nestable
- jquery.notific8
- jquery.slimScroll
- jquery.tagsinput
- noUiSlider
- jquery.zoom
- jquery.easing
- jquery.input-ip-address-contro
- bootstrap.transition
- bootstrap.modal
- bootstrap.scrollspy
- bootstrap.tab
- bootstrap.tooltip
- bootstrap.popover
- bootstrap.collapse
- bootstrap.carousel
- bootstrap-hover-dropdown
- bootstrap-switch
- bootstrap-colorpicker
- bootstrap-star-rating
- bootstrap-modal
- bootstrap-confirmation
- bootstrap-contextmenu
- bootstrap-datepicker
- bootstrap-datetimepicker
- bootstrap-daterangepicker
- bootstrap-timepicker
- bootstrap-table
- x-editable
- bootstrap-growl
- bootstrap-markdown
- bootstrap-maxlength
- bootstrap-select
- bootstrap-selectsplitter
- bootstrap-tabdrop
- bootstrap-touchspin
- bootstrap-wizard
- clockface
- bootstrap-auto-hiding-navbar
- bootstrap-duallistbox
- bootstrap-autohidingnavbar
- fuelux
- bootstrap-multiselect
- respond
- moment
- PubSubJS
- stickUp
- typeahead
- fullcalendar
- dropzone
- autosize
- ueditor
- Web Uploader
- echarts
jquery.jsonp
jquery强化jsonp支持的api, 允许定义返回错误的处理
jquery.blockui
这个插件可以轻松实现模拟锁屏, 遮罩效果, 在做弹出层效果, 以及做操作提示时非常有用
jquery.uniform
Web表单是一个网站的重要方面，但在视觉方面往往被忽视。这个插件可以帮助你增加一个华丽的外观和视觉效果。 例如单选按钮或选择下拉菜单，这些资源只能用简单的CSS，这通常是一件痛苦的事情
jquery.layout
这个插件是一种基于jquery的布局框架，其核心是一个大小自适应的中心面板，面板的上下左右四个方向可以放置可折叠、可缩放的面板, 在做管理类的系统时特别有用
jquery.cookie
这个插件是对原生cookie的api的封装, 适合存放小数据
jquery.validate
老版jquery表单验证插件, 功能也十分强大, 除了能做本地验证之外, 还可以轻松实现远程请求验证, 支持扩展, 自定义
jquery.form
这个插件API提供了几个方法，让你轻松管理表单数据和进行表单提交。
jquery.transit
这个插件可以通过js api的方式实现css过渡效果, 而不用手动编写css
jquery.bxslider
走马灯插件
jquery.qrcode
生成二维码插件
jquery.chosen
jquery chosen一款强化原生select的插件,支持检索,多选,但不支持输入效果,
select2
强化原生select的功能强大的组件, 支持搜索, 远程加载等
jquery.backstretch
响应式背景图轮换, 可以设置页面背景图片, 也可以让背景图片动态切换, 缺点是图片可能太大会导致加载速度变慢
jquery-siderbar
一个简易的侧边栏组件
jquery-autocomplete
一个功能强大的自动填充/搜索推荐组件
jquery.slimscroll
实用jquery滚动条特效插件jquery slimScroll
jquery.vmap
JQVAMP是一款jquery矢量地图生成插件, 不过没有热点功能
jquery.jqzoom
jqzoom是一款图片放大镜插件, 常用于电商的商品详情页面
jquery.imgScroll
这个插件比较简单, 多是自定义版本
jquery.metadata
元数据插件, 在html标签属性里传对象值使用
jquery.lazyload
延迟加载图片插件, 如果要实现自定义的延迟加载内容, 可以在插件基础上进行扩展
jquery.ad-gallery
使用AD Gallery可以制作出强大的相册画廊
jquery.fancybox
强大的弹出层插件, 支持静态内容, 远程请求ajax内容, iframe, 图片切换等加载方式
jquery.poshytip
类似原生的工具条tooltip插件
jquery.raty
打星评分插件
OwlCarousel
强大的旋转木马(传送带)插件
jquery-contextMenu
强大的右键菜单插件
jquery-timeago
将时间戳显示为多少时间前的强大插件
jquery-sessionTimeout
让页面在经过一段时间后, 会弹出提示框, 让用户确认是否要登出还是继续保持连接, 超时后自动跳转至登出(阿里云邮箱有使用)
jquery.toastr
类似android里源生的toast的效果
jquery.cubeportfolio
收费插件, 做各种类型的grid展现, 图文并茂(样子很不错, 交互可以借鉴, 并没有特别的功能, 只是功能集+炫)
jquery.countdown
倒计时插件
jquery.dataTables
强大的数据表格插件, 支持定义成bootstrap样式
jquery.gritter
notification提示插件, 不过太久不更新了…
icheck
强大的美化check, radio的插件, 支持jquery和Zepto
ion.rangeSlider
刻度针选择插件
jquery.Jcrop
图案范围裁剪插件, 常用于上传头像的范围裁剪
jquery.color
cssHook, 能使jquery animate API 使用骆峰式的颜色动画变化
jquery.bootpag
基于boostrap的简单pagination插件
jquery.pagination
简单的pagination插件, 页码多时支持显示…, 支持bootstrap样式需要修改源代码, 隐藏a标签默认显示hash需要修改源代码
jquery.idletimer
用于前端页面定时(判断是否超时, 以及后续操作)
jquery.inputMask
格式化录入的jquery插件
jquery knob
旋钮插件, 圆形把手(可用于百分比显示)
jquery.minicolors
简单的colorpicker插件
mixitup
无刷新动画排序插件
Nestable
拖放分层项
jquery.notific8
win8的notification插件
jquery.slimScroll
自定义滚动条插件
jquery.tagsinput
inputtext输入项展现时是一个个标签
noUiSlider
刻度范围选择rangeSlider
jquery.zoom
图片放大插件
jquery.easing
扩展jquery动画效果插件
jquery.input-ip-address-control
让input变成ip地址格式输入
jquery.parallax
视差插件
jquery.ScrollTo
控制滚动条渐变滚动插件
jquery.sparkline
迷你线图(反应数据趋势)
jquery-migrate
用于兼容旧版本比如1.9以下的移除的API
bootstrap.transition
用以支持bootstrap的组件的过渡效果
bootstrap.modal
用以支持bootstrap的组件的模态框, 支持静态方式使用, 也支持弹出方式
bootstrap.dropdown
用以支持bootstrap的下拉菜单组件
bootstrap.scrollspy
滚动监听插件依赖 Bootstrap 的导航组件 用于高亮显示当前激活的链接。
bootstrap.tab
标签页组件依赖 Bootstrap 的导航组件
bootstrap.tooltip
类似原生浏览器的工具条提示
bootstrap.popover
弹出框依赖 工具提示插件
bootstrap.button
按钮的功能很丰富。通过控制按钮的状态或创建一组按钮并形成一些新的组件，例如工具条。
也可以自定义按钮点击后的状态, 例如设置按钮正在loading
bootstrap.collapse
实现内容展开, 以及缩回的功能, 支持according
bootstrap.carousel
走马灯, 但是动画效果不支持ie8,9
bootstrap.affix
模拟将元素变成sticky效果
bootstrap-hover-dropdown
bootstrap中的dropdown组件扩展hover事件
bootstrap-switch
Bootstrap 开关（switch）控件
bootstrap-colorpicker
一个定制化的颜色拾取器插件, 依赖于Bootstrap 2 & 3
bootstrap-star-rating
打星评分插件
bootbox
不用事先写死html代码就能使用bootstrap的各种弹出模态框
bootstrap-modal
强化了bootstrap源生的modal, 增加了居中显示, 远程ajax加载, 加载时显示进度条等功能
bootstrap-confirmation
依赖于bootstrap的tooltip组件, 在用户交互后, 弹出工具确认框, 引导用户进行确认或取消操作
bootstrap-contextmenu
右键菜单插件
bootstrap-datepicker
强大的日期插件, 但需要自己扩展中文的支持
bootstrap-datetimepicker
支持时分秒的日期插件, 需要自己扩展中文的支持
bootstrap-daterangepicker
日期范围选择插件, 但在选取日期时存在二个文本框值相同的bug, 并且ie8上样式也存在问题
bootstrap-table
基于bootstrap的数据表格
x-editable
任意处都可以弹出工具层, 进行编辑, 支持客户端与服务端验证, 支持提交数据至远程
bootstrap-growl
notification提示操作信息插件
bootstrap-gtreetable
树形数据表格插件, 在后台管理系统中做层级少的配置项操作中可以考虑使用(这样用不需要使用tree插件了)
bootstrap-markdown
markdown编辑器, 如果程序员使用的话, 可以考虑使用该编辑器进行文章发布
bootstrap-maxlength
单行或多行文本框在输入时给予友好提示(在元素附近小工具层提示), 当前输入了多少个字, 最大能输入多少个字
bootstrap-pwstrength
提示密码强度的插件
bootstrap-select
美化select插件, 功能类同chosen
bootstrap-selectsplitter
能把一个分组的select变成二个select, 一个选择分组, 另外一个级联选择分组下的内容(使用机会不多)
bootstrap-tabdrop
水平显示tab标签时, 如显示不下了, 这个插件可以把显示不下的tab自动并入右方一处下拉选项中, 可以自适应(只有resize事件). 要做到像各种IDE那样又能左右切换, 又有drop菜单, 并且在drop菜单中选择一项会智能定位到那一项等, 还需要自定义
bootstrap-timepicker
简单的日期选择插件
bootstrap-touchspin
加减数字以方便输入数字值的插件(三个部件, 文本框, 减按钮, 加按钮)
bootstrap-wizard
标签+步骤插件, 比如注册环节步骤, 比如下订单环境步骤(要注意, 区别是传统做法, 插件使用的步骤都是在同一个页面, 输入项最终一起提交)
clockface
长的像时钟的时间选择控件
bootstrap-duallistbox
左右ListBox选项互选插件
bootstrap-autohidingnavbar
页面滚动条下拉后, 自动隐藏顶部navbar(一般电商需求是, 下拉到一定位置后navbar自动sticky…)
fuelux
美化了各种控件, 比如常见的表单控件, 基于bootstrap3(使用机会不大)
bootstrap-multiselect
多选插件
bootstrap-tagsinput
input输入项变成标签
respond
让ie9以下支持media query
moment
强大的日期API库(格式化日期首选)
stickUp
这是一个简单的jQuery插件，它能让页面目标元素 “固定” 在浏览器窗口的顶部，即便页面在滚动， 目标元素仍然能出现在设定的位置。此插件可以在多页面的网站上工作，也能在单页面上面实现导航功能。滚动当前页面看看导航条的效果吧。
PubSubJS
强大的订阅/发布模式实现的js库, 常用于模块间通信, 以解决业务模块的耦合问题
typeahead
强大的自动补全/搜索推荐插件
fullcalendar
强大的日历组件
dropzone
拖放的范围内允许上传文件, 有进度条等支持
autosize
使textarea能根据文字输入自适应高度
ueditor
百度编辑器插件
Web Uploader
百度上传文件插件
echarts
百度生成数据分析图形插件
