js开源组件开发系列一索引

                        2015.8 by 田想兵 个人网站

从3月份进入新公司以来,时经五个月,我以平均每周1个小组件的速度,已经完成的js组件有22个之余了,已基本上全部用到实际项目中,这些小而简的组件,已能基本支持现在项目中所会遇到的前端功能性需求,所以在这里,把它们列出来,后面可能还会有一些更新:

1.日历组件(可多选) 

           

     源码git:https://github.com/tianxiangbing/calendar

    demo:http://www.lovewebgames.com/jsmodule/calendar.html

2.dialog对话框弹层

      

    源码git:https://github.com/tianxiangbing/dialog

    demo:http://www.lovewebgames.com/jsmodule/dialog.html

3.手机端上传图片

      

    源码git:https://github.com/tianxiangbing/mobile-upload

    demo:http://www.lovewebgames.com/jsmodule/mobile-upload.html

4.滚动加载数据(支持移动端)

      

    源码git:https://github.com/tianxiangbing/scroll-load

    demo:http://www.lovewebgames.com/jsmodule/scroll-load.html

5.手机端选择地区联动(仿ios)

      

    源码git:https://github.com/tianxiangbing/mobile-select-area

    demo:http://www.lovewebgames.com/jsmodule/mobile-select-area.html

6.手机端照片预览组件(可滑动切换图片)

      

    源码git:https://github.com/tianxiangbing/mobile-photo-preview

    demo:http://www.lovewebgames.com/jsmodule/mobile-photo-preview.html

7.手机端日期选择(仿ios效果)

      

    源码git:https://github.com/tianxiangbing/mobile-select-date

    demo:http://www.lovewebgames.com/jsmodule/mobile-select-date.html

8.轮播切换图片-支持手机滑动

      

    源码git:https://github.com/tianxiangbing/carousel-image

    demo:http://www.lovewebgames.com/jsmodule/carousel-image.html

9.js异步上传文件(iframe pc端)

    源码git:https://github.com/tianxiangbing/upload

    demo:http://www.lovewebgames.com/jsmodule/upload.html

10.文本输入框计数统计

      

    源码git:https://github.com/tianxiangbing/word-count

    demo:http://www.lovewebgames.com/jsmodule/word-count.html

11.图片懒加载

      

    源码git:https://github.com/tianxiangbing/lazy-load

    demo:http://www.lovewebgames.com/jsmodule/lazy-load.html

12.图片放大镜(支持移动触屏)

      

    源码git:https://github.com/tianxiangbing/image-zooming

    demo:http://www.lovewebgames.com/jsmodule/image-zooming.html

13.ajax分页插件paging

      

    源码git:https://github.com/tianxiangbing/paging

    demo:http://www.lovewebgames.com/jsmodule/paging.html

14.获取url参数和form表单json格式

      

    源码git:https://github.com/tianxiangbing/query

    demo:http://www.lovewebgames.com/jsmodule/query.html

15.table表格渲染组件

      

    源码git:https://github.com/tianxiangbing/table

    demo:http://www.lovewebgames.com/jsmodule/table.html

16.自动提示搜索框autosearch

      

    源码git:https://github.com/tianxiangbing/autosearch

    demo:http://www.lovewebgames.com/jsmodule/autosearch.html

17.输入框数字或金额格式化

      

    源码git:https://github.com/tianxiangbing/format-number

    demo:http://www.lovewebgames.com/jsmodule/format-number.html

18.ajax请求的扩展(防重复点击加载中)

      

    源码git:https://github.com/tianxiangbing/network

    demo:http://www.lovewebgames.com/jsmodule/network.html

19.loading加载中动画效果

      

    源码git:https://github.com/tianxiangbing/loading

    demo:http://www.lovewebgames.com/jsmodule/loading.html

20.tip小提示组件

      

    源码git:https://github.com/tianxiangbing/tip

    demo:http://www.lovewebgames.com/jsmodule/tip.html

21.模拟下拉选项框select

      

    源码git:http://www.lovewebgames.com/jsmodule/select.html

    demo:http://www.lovewebgames.com/jsmodule/select.html

22.?

  说好的22个呢?因为那个实在跟项目无关,是一个Q群屌丝好友,说要做这么个功能,于是我就花时间做了,发现很少用到,所以这里就不提了,如果有兴趣了解的话可以去http://www.lovewebgames.com/jsmodule/click-progress.html这里看下,就是一个血条,然后越点血就涨越多,不点就掉来。多么无趣的东西,所以呢,如果你在项目中遇到了很有意思的功能,自己又弄不出来时,可以找我,如果我觉得好玩,我就做了。但不要私聊我,你懂的,加我Q群5678537或70210212,77813547.

【2015上半年总结】js开源组件开发系列索引的更多相关文章

  1. [js开源组件开发]network异步请求ajax的扩展

    network异步请求ajax的扩展 在日常的应用中,你可能直接调用$.ajax是会有些问题的,比如说用户的重复点击,比如说我只希望它成功提交一次后就不能再提交,比如说我希望有个正在提交的loadin ...

  2. [js开源组件开发]数字或金额千分位格式化组件

    数字或金额千分位格式化组件 这次距离上一个组件<[js开源组件开发]table表格组件>时隔了一个月,由于最近的项目比较坑,刚挖完坑,所以来总结性提出来几个组件弥补这次的空缺,首先是金额和 ...

  3. [js开源组件开发]query组件,获取url参数和form表单json格式

    query组件,获取url参数和form表单json格式 距离上次的组件[js开源组件开发]ajax分页组件一转眼过去了近二十天,或许我一周一组件的承诺有了质疑声,但其实我一直在做,只是没人看到……, ...

  4. [js开源组件开发]localStorage-cache本地存储的缓存管理

    localStorage-cache本地存储的缓存管理 距离上次的组件开发有近三个月的时间了,最近一直在做一些杂事,无法静下心来写写代码,也是在学习emberjs,在emberjs中有一个很重要的东西 ...

  5. [js开源组件开发]js手机端浮层控件,并有多种弹出小提示,兼容pc端浏览器

    js dialog组件,包含alert和confirm的实现 本组件所有的资源均在github上可以查看源代码 GitHub 本dialog的组件的例子请在这里查看 demo dialog js di ...

  6. [js开源组件开发]ajax分页组件

    ajax分页组件 我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的.这个组件主要完成分页的工作. 这张图里显示 ...

  7. [js开源组件开发]图片放大镜

    图片放大镜 一般情况下,手机由于屏幕太小,会有图片上看不清的问题,所以我就做了一个放大镜的js效果,支持pc和移动端.它的原理是利用的backgroundsize来实现的,所以你的浏览器首先要支持这个 ...

  8. [js开源组件开发]tip提示组件

    tip提示组件 常见的应用场景中,总是难免会遇到提示信息,比如显示不完全时需要鼠标移上去显示title,比如验证时的错误提示,比如操作按钮的辅助说明等,所以我独立出来了一个小的js组件,tip提示组件 ...

  9. [js开源组件开发]loading加载效果

    loading加载效果 由于程序和网络的原因,常常我们需要在交互的时候,给用户一个正在加载中的动画,于是,loading组件横空出世.不需要复杂的代码,也能完成大多数业务,这就是我做组件的原则. 效果 ...

随机推荐

  1. HTML内联元素

    前面的话 用于标记段落里的文本和其他内容组的元素种类很多,本文将这些文本级元素进行简单分类,便于整理和记忆 通用容器 <span>元素是短语内容的通用行内容器,并没有任何特殊语义.可以使用 ...

  2. TortoiseSVN安装以及淘宝 TAE SDK 开发环境的搭建

    一.TortoiseSVN 的下载和安装 1.进入TortoiseSVN 官网下载地址http://tortoisesvn.net/downloads.html,根据自己的操作系统位数下载相应最新版本 ...

  3. Rxjava基础

    现在很多Android App的开发开始使用Rxjava,但是Rxjava以学习曲线陡峭著称,入门有些困难.经过一段时间的学习和使用,这里来介绍一下我对Rxjava的理解. 说到Rxjava首先需要了 ...

  4. T-SQL中jion操作

    --创建学生表 create table Students( sno nvarchar(10) not null primary key, name nvarchar(30) not null, ge ...

  5. Windows Azure Virtual Machine (26) 使用高级存储(SSD)和DS系列VM

    <Windows Azure Platform 系列文章目录> Update: 2016-11-3,如果大家在使用Linux VM,使用FIO进行IOPS测试的时候,请使用以下命令: su ...

  6. QT学习笔记4

    顶层窗口-MainWindow 新建项目,选择基类的时Base Class是QMainWindow 最上面是Window Title,用于显示标题和控制按钮,比如最大化.最小化和关闭等:下面一些是Me ...

  7. 我如何调优SQL Server查询

    我是个懒人,我只想干尽可能少的活.当我干活的时候我不想太多.是,你没看错,这看起来很糟糕,作为一个DBA这很不合格.但在今天的文章里,我想给你展示下,当你想对特定查询创建索引设计时,你如何把你的工作和 ...

  8. 经验分享:CSS浮动(float,clear)通俗讲解

    很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程. 前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家. 写在前面的话: 由于CSS内容比较多 ...

  9. 基于HT for Web的Web SCADA工控移动应用

    在电力.油田燃气.供水管网等工业自动化领域Web SCADA的概念已经提出了多年,早先年的Web SCADA前端技术大部分还是基于Flex.Silverlight甚至Applet这样的重客户端方案,在 ...

  10. 30天C#基础巩固------读写流(StreamWrite/StreamReader)

    一:读写流的一些案例. --->关于StreamWrite       这里的一些常用的方法和我们之前的那个FileStream是一样的,参数很多都是一样的用法. Console.WriteLi ...