All Projects → lovefc → Fcup

lovefc / Fcup

jquery大文件分片上传插件-fcup.js

Programming Languages

js
455 projects

Projects that are alternatives of or similar to Fcup

Fileup
FileUp - JQuery File Upload
Stars: ✭ 10 (-91.67%)
Mutual labels:  upload, jquery
Ax5ui Kernel
Javascript UI Framework - AX5UI - Kernel Module
Stars: ✭ 164 (+36.67%)
Mutual labels:  upload, jquery
Uploader
A lightweight and very configurable jQuery plugin for file uploading using ajax(a sync); includes support for queues, progress tracking and drag and drop.
Stars: ✭ 1,042 (+768.33%)
Mutual labels:  upload, jquery
Bootstrap Fileinput
An enhanced HTML 5 file input for Bootstrap 5.x/4.x./3.x with file preview, multiple selection, and more features.
Stars: ✭ 5,097 (+4147.5%)
Mutual labels:  upload, jquery
Droply Js
Droply JS, a new responsive and cross browser chunk uploader with DragDrop and File Preview capabilities (HTML5/CSS3)
Stars: ✭ 50 (-58.33%)
Mutual labels:  upload, jquery
Nukeviet
NukeViet CMS is multi Content Management System. NukeViet CMS is the 1st open source content management system in Vietnam. NukeViet was awarded the Vietnam Talent 2011, the Ministry of Education and Training Vietnam officially encouraged to use.
Stars: ✭ 113 (-5.83%)
Mutual labels:  jquery
Simplebox.js
A simple, responsive lightbox plugin.
Stars: ✭ 116 (-3.33%)
Mutual labels:  jquery
Fileuploader
Beautiful and powerful HTML file uploading tool. A jQuery, PHP and Node.js plugin that transforms the standard input into a revolutionary and fancy field on your page.
Stars: ✭ 111 (-7.5%)
Mutual labels:  jquery
Footer Reveal
A jQuery plugin for easy implementation of the 'fixed/reveal' footer effect. Demo here:
Stars: ✭ 111 (-7.5%)
Mutual labels:  jquery
Vue Datatables Net
Vue jQuery DataTables.net wrapper component
Stars: ✭ 119 (-0.83%)
Mutual labels:  jquery
Universal Tilt.js
🎆 Parallax tilt effect library
Stars: ✭ 117 (-2.5%)
Mutual labels:  jquery
Isonscreen
Simple jQuery plugin to determine if an element is within the viewport
Stars: ✭ 115 (-4.17%)
Mutual labels:  jquery
Neat
🎈 Neat是一个追求极致优雅,高效,简洁,只为现代浏览器的,jQuery兼容的JavaScript库,只有3.7K(gzip)!
Stars: ✭ 114 (-5%)
Mutual labels:  jquery
Pushy
Pushy is a responsive off-canvas navigation menu using CSS transforms & transitions.
Stars: ✭ 1,488 (+1140%)
Mutual labels:  jquery
Clone Section Of Form Es6 Or Jquery
Now on npm. Using vanilla JavaScript (ES6) or jQuery to duplicate a section of a form, maintaining accessibility (a11y).
Stars: ✭ 112 (-6.67%)
Mutual labels:  jquery
Django Crud Ajax Login Register Fileupload
Django Crud, Django Crud Application, Django ajax CRUD,Django Boilerplate application, Django Register, Django Login,Django fileupload, CRUD, Bootstrap, AJAX, sample App
Stars: ✭ 118 (-1.67%)
Mutual labels:  jquery
Bootstrap Validate
A simple Form Validation Library for Bootstrap 3 and Bootstrap 4 not depending on jQuery.
Stars: ✭ 112 (-6.67%)
Mutual labels:  jquery
Anypicker
jQuery Picker Library for Android, iOS & Windows Phone. eg Date Picker, Time Picker, DateTime Picker, Custom Select etc
Stars: ✭ 114 (-5%)
Mutual labels:  jquery
Jquery Validation
jQuery Validation Plugin library sources
Stars: ✭ 10,141 (+8350.83%)
Mutual labels:  jquery
Mobiscroll
Cross platform UI controls for progressive web and hybrid apps (plain JS, jQuery, Angular and React)
Stars: ✭ 1,510 (+1158.33%)
Mutual labels:  jquery

fcup.js

此版本已不在更新,新版本请移步至 https://gitee.com/lovefc/fcup2

fcup.js是一款支持大文件切片上传插件。该jquery插件使用简单,配置简单明了,支持上传类型指定,支持自定义各种事件处理,完全可以用来打造属于个性的文件上传功能。

avatar

安装

直接下载源码,演示地址: http://fcphp.cn/fcup

使用方法

    $.fcup({

         upId: 'upid', //上传dom的id

         upShardSize: '1', //切片大小,(单次上传最大值)单位M,默认2M

         upMaxSize: '20', //上传文件大小,单位M,不设置不限制

         upUrl: './php/file.php', //文件上传接口

         upType: 'jpg,png,jpeg,gif', //上传类型检测,用,号分割

         //接口返回结果回调,根据结果返回的数据来进行判断,可以返回字符串或者json来进行判断处理
         upCallBack: function (res) {

            var status = res.status;

            var msg = res.message;

            // 已经完成了
            if (status == 2) {
               alert(msg);
               $('#pic').attr("src", res.url);
               $('#pic').show();
            }

            // 还在上传中
            if (status == 1) {
               console.log(msg);
            }

            // 接口返回错误
            if (status == 0) {
               // 停止上传触发$.upStop函数
               $.upErrorMsg(msg);
            }
            
            // 已经上传过了
            if (status == 3) {
               Progress(100);
               $('#pic').attr("src", res.url);
               $('#pic').show();
               // 停止上传触发$.upStop函数
               $.upErrorMsg(msg);
            }            
         },

         // 上传过程监听,可以根据当前执行的进度值来改变进度条
         upEvent: function (num) {
            // num的值是上传的进度,从1到100
            Progress(num);
         },

         // 发生错误后的处理
         upStop: function (errmsg) {
            // 这里只是简单的alert一下结果,可以使用其它的弹窗提醒插件
            alert(errmsg);
         },

         // 开始上传前的处理和回调,比如进度条初始化等
         upStart: function () {
            Progress(0);
            $('#pic').hide();
            alert('开始上传');
         }

      });

更新日志

2018/1/8 : 添加了对于接口返回结果的回调,添加了对于上传表单id的指定

2018/1/10 : 添加了node.js的上传接口,基于express框架

2018/1/17 : 优化了分片异步处理,队列执行接口,修复细节

2018/5/02 : 添加了文件大小的判断,添加了对于文件md5的计算,添加了终止函数,传值到后台使用,优化细节部分

2019/5/21 : 分离了原来的进度动画,现在用户可以自定义自己的动画和按钮,分别提供了各种回调事件以便处理

2019/8/12 : 修复了获取md5值的bug,感谢Matty的提醒

2019/10/22: 修改了终止事件循环执行的bug

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].