介绍

可以拖拽上传的 js库

网址 http://www.dropzonejs.com/

同类类库

1.jquery.fileupload   http://blueimp.github.io/jQuery-File-Upload/

2. file-uploader  https://github.com/Valums-File-Uploader/file-uploader

这2个类库分别用过..感觉,2轻巧方便些..

这个dropzonejs 其实也很轻巧

用法

1. add js and css style

<link href="~/Dropzone/css/basic.css" rel="stylesheet" />
<link href="~/Dropzone/css/dropzone.css" rel="stylesheet" />
<script src="~/Dropzone/dropzone.min.js"></script>

2. post  data

<form action="~/Home/SaveUploadedFile" method="post"
    enctype="multipart/form-data" class="dropzone"
    id="dropzoneForm">
</form>

3.handling Server Response

<script type="text/javascript">
    Dropzone.options.dropzoneForm = {
        init: function () {
            this.on("complete", function (data) {
                var res = eval('(' + data.xhr.responseText + ')');
                alert(res.Message);
            });
        }
    };
</script>

4.支持较旧的浏览器.same  ie6

具体例子 参考 官   http://www.dropzonejs.com/

]]>

DropzoneJS 可以拖拽上传的js库的更多相关文章

  1. dropzonejs中文翻译手册 DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库.

    http://wxb.github.io/dropzonejs.com.zh-CN/dropzonezh-CN/ 由于项目需要,完成一个web的图片拖拽上传,也就顺便学习和了解了一下前端的比较新的技术 ...

  2. DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库.

    DropzoneJS是一个提供文件拖拽上传并且提供图片预览的开源类库. 它是轻量级的,不依赖任何其他类库(如JQuery)并且高度可定制. 试试看! 将文件拖至此处或点击上传.(这仅仅是 dropzo ...

  3. Dropzone.js实现文件拖拽上传

    dropzone.js是一个开源的JavaScript库,提供 AJAX 异步文件上传功能,支持拖拽文件.支持最大文件大小.支持设置文件类型.支持预览上传结果,不依赖jQuery库. 使用Dropzo ...

  4. 基于 jq 实现拖拽上传 APK 文件,js解析 APK 信息

    技术栈 jquery 文件上传:jquery.fileupload,github 文档 apk 文件解析:app-info-parser,github 文档 参考:前端解析ipa.apk安装包信息 - ...

  5. php和js实现文件拖拽上传

    Dropzone.js实现文件拖拽上传 http://www.sucaihuo.com/php/1399.html demo http://www.sucaihuo.com/jquery/13/139 ...

  6. js拖拽上传 文件上传之拖拽上传

    由于项目需要上传文件到服务器,于是便在文件上传的基础上增加了拖拽上传.拖拽上传当然属于文件上传的一部分,只不过在文件上传的基础上增加了拖拽的界面,主要在于前台的交互, 从拖拽的文件中获取文件列表然后调 ...

  7. 实现拖拽上传文件的一款小控件——dropzone

    由于专注所以专业.非常多小巧的东西乍一看非常不起眼,却在特定的领域表现不俗,就是由于集中了热情. dropzone就是这样一款小控件,实现拖拽上传.它不依赖于其他像jquery等JS库.并且支持多方面 ...

  8. 图片上传插件ImgUploadJS:用HTML5 File API 实现截图粘贴上传、拖拽上传

    一 . 背景及效果 当前互联网上传文件最多的就是图片文件了,但是传统web图片的截图上传需要:截图保存->选择路径->保存后再点击上传->选择路径->上传->插入. 图片 ...

  9. h5图片上传预览与拖拽上传

    图片上传: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

随机推荐

  1. SQL随笔

    多表分页查询: ,; 向表中插入新的字段: ALTER TABLE `Table_name` ) NOT NULL DEFAULT '' AFTER `id`;  更新表数据: UPDATE [LOW ...

  2. oracle 大文本由clob来存

    file字段是varchar2类型(最多只能存储4000字符),空间不够用了,因此将其改为clob类型(支持4G存储量). 但是如果该字段中已经有数据,是不为空的,直接用语句改,会报错. 那么需要借助 ...

  3. [Angular 2] ng-class and Encapsulated Component Styles

    import {Input, Component, View, NgClass} from "angular2/angular2"; @Component({ selector: ...

  4. Qt 属性

      Qt提供了一套和一些编译器提供商也提供的属性系统类似的完善的属性系统.然而,作为一个不依赖编译器和平台的库,Qt不能依赖像__property或者[property]那样的非标准编译器特征.我们的 ...

  5. Meth | 安装Linux Mint 18以后grub2 win10启动引导项丢失??!!

    进入mint,打开终端输入:sudo update-grub2

  6. Mac上安装pexpect

    1.首先安装pip sudo easy_install pip 2.pip安装pexpect sudo pip install pexpect

  7. HDU 3533 Escape(bfs)

    Escape Time Limit: 20000/10000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  8. android省电开发之cpu降频

    众所周知,在android系统的耗电量排行里,cpu的耗电占了比较大的一部分比例,也就是说,cpu的使用率和使用频率将直接或间接的影响电量的分配和使用,但很遗憾,android-sdk中没有为andr ...

  9. spring aop pointcut 切入点是类的公共方法(私有方法不行),还是接口的方法

    spring aop pointcut 切入点是类的公共方法(私有方法不行),还是接口的方法 类的公共方法可以,但是私有方法不行 测试一下接口的方法是否能够捕捉到

  10. 一个tomcat部署俩个java web项目

    2.发布的时候可以发布成war包,用项目名称右键export,选择项目名称,还有发布的路径,即tomcat下的路径,参考http://zhidao.baidu.com/link?url=imOu0Uu ...