前端开发必备！推荐Github最新热门表单开源框架HTML+CSS+JavaScript

表单元素在web项目开发中是必备的组件，原生的表单控件都不大友好，除了能满足功能需求，对于用户体验来说还需要开发者修改各种样式，另外，对于表单还用对文件进行验证和上传等操作，要达到更个人化的设计需要花费很多精力。目前，开源社区都比较活跃，大量优秀的开源框架出现，给我们开发者带来了很大的便利。

一般来说我们用框架协助开发是最好的方式，简化设计也节省开发时间。在这里我主要介绍github上比较热门的表单开源框架，主要参考项目的star数、提交数和最新更新时间。

1、 jQuery文件上传插件jQuery-File-Upload

bootstrap和原生的文件上传样式都显得比较丑陋，该文件上传插件支持更友好的样式。

1）支持多文件选择；

2）支持文件拖动上传；

3）进度条显示；

4）文件验证和图像预览；

5）支持音频和视频；

6）支持跨域；

7）支持标准HTML表单文件上传；

8）跨平台，适用于任何服务端平台（PHP、Python、Ruby on Rails、Java、Node）。

Github地址：https://github.com/blueimp/jQuery-File-Upload

2、fine-uploader多文件上传插件

同样是一个文件上传插件。

1）多文件上传，支持拖放，支持进度条；

2）支持S3和Azure，支持图像缩放，支持HTML表单；

3）支持分块、恢复、暂停等大量特性。

不过可惜的是，该项目已不再维护了。不过你仍然可以根据需求进行使用。

Github地址：https://github.com/FineUploader/fine-uploader

3、form jQuery表单插件

该插件主要是关于表单文件上传的相关处理的，jQuery表单插件允许你轻松地使用AJAX升级HTML表单。主要使用ajaxForm和ajaxSubmit从表单元素收集信息，以及确定提交过程，这两种方法都支持许多选项，允许你完全控制如何提交数据，更简单优雅地用ajax提交表单。

Github地址：https://github.com/jquery-form/form

4、jQuery-Mask-Plugin jQuery蒙版插件

一个jQuery插件，用户在表单字段和HTML元素上制作蒙版。

1）轻量级，体积容量小，支持动态添加元素；

2）支持任何HTML元素上的掩码，HTML符号支持；

3）字符串数字等混合蒙版；

4）兼容React，Zepto.js，Angular.js等。

Github地址：https://github.com/igorescobar/jQuery-Mask-Plugin

5、django-crispy-forms Django表单

Github地址：https://github.com/django-crispy-forms/django-crispy-forms

Django创建表单的最佳方法。使用组件构建可编程的可重用布局，完全控制呈现的HTML，而不需要在模板中编写HTML。所有这些都没有破坏Django中处理事情的标准方式，因此它可以很好地处理任何其他表单应用程序。

Django -crisp -forms支持Python 2.7/Python 3.3+和Django 1.8/Django 1.10+。该应用程序主要提供:

1）一个名为|crispy的过滤器，它将呈现优雅的基于div的表单。可以将其视为内置方法:as_table、as_ul和as_p。你无法调整输出，但很容易开始使用它。

2）一个名为{% crispy %}的标记，它将根据您的配置和特定的布局设置呈现表单。这给你惊人的力量，没有太多的麻烦，帮助你节省大量的时间。

django -crisp -forms支持几个前端框架，比如Twitter引导(版本2、3和4)、统一表单和Foundation。您还可以轻松地调整自定义公司的模式，创建自己的模式，有关更多信息，请参见文档。您可以使用CRISPY_TEMPLATE_PACK设置变量在它们之间轻松切换。