前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >【开源】1句代码搞定图片批量上传,无需什么代码功底【无语言界限】

【开源】1句代码搞定图片批量上传,无需什么代码功底【无语言界限】

作者头像
逸鹏
发布2018-04-10 14:19:25
6580
发布2018-04-10 14:19:25
举报
文章被收录于专栏:逸鹏说道逸鹏说道

开源地址:https://github.com/dunitian/LoTUploader

WebUploader基础上的封装改善,一句代码全部实现(样式美化,实例JS优化(配置优化,样式调整,名称+大小显示,错误处理等),后端代码。。。。。)

效果:(完整demo:https://github.com/dunitian/LoTUploader/tree/V1.0/Demo)

一句代码:$.lotuploader('lot-uploader', '/Home/Upload'); //必填参数:ID,Server地址 (完整案例看Demo部分)

第一步:引入样式

代码语言:javascript
复制
<link href="Scripts/lotUploader/lotuploader1.0.min.css" rel="stylesheet" />

第二步:自己定义一个DIV(id名任意)

代码语言:javascript
复制
<div id="lot-uploader"></div>

第三步:引入脚本

代码语言:javascript
复制
<script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
<script src="Scripts/lotUploader/lotuploader1.0.min.js"></script>

代码部分:

代码语言:javascript
复制
<script type="text/javascript">
$.lotuploader('lot-uploader', 'Post处理地址');//必填参数:ID,
//选填参数:count最大上传数(默认5),Size文件大小(默认10M)
//$.lotuploader('lot-uploader', '/Home/Upload', 1, 1024 * 1024 * 4);
</script>

注意点:

代码语言:javascript
复制
如果你项目并不使用font-awesome,那请吧.upload-state-done:after样式修改一下,这样成功后就很明了

案例没有采用纯Net语法,只是把服务端处理用Net处理了下。index.html部分通用
本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2016-05-30,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 我为Net狂 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档