基于fileInput实现下载功能

之前做了上传,看了下下干脆吧下载也做了,而且bootstrap 的fileinput 既然有预览那些功能将就那个改一改。

首先是好心人写的下载源代码在之前的文章里已经有了

http://blog.csdn.net/devil_may_crying/article/details/72415558

我要做的就是修改上传的加载添加入一个下载按钮,简单的东西,不过鉴于英语有限其实我弄了一天多才搞完。

好了首先是代码块:


上传和下载是一样共用一个页面,将他设置为一个弹出model作为一个模板。

然后是Js图片预览加载还有添加下载图标和事件


这个obj是通过ajax传过来的图片数组即:


对应的下载事件就是test(); 在生成的预览窗里面fileinput.js会帮你迭代好属性和数据要获取到图片的路径只要加一个{data}如



搞定;so  easy 。。。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Bootstrap fileinput是一个基于Bootstrap框架的jQuery插件,用于实现文件上传功能。它具有以下特点: 1. 美观易用:Bootstrap fileinput易于集成到网站设计中,提供了用户友好的界面,可以简化用户上传文件的操作过程。 2. 多样化的展示模式:Bootstrap fileinput提供了多种展示模式,包括缩略图模式、网格模式等,可以根据需求选择最适合的模式来展示已上传的文件。 3. 支持多文件上传:Bootstrap fileinput支持同时上传多个文件,通过简单的配置即可实现一次性上传多个文件。 4. 图片预览功能:在上传图片的情况下,Bootstrap fileinput可以实现图片预览功能,用户可以在上传前预览图片的效果,以便做出更好的选择。 5. 文件验证和限制:Bootstrap fileinput可以对文件进行验证和限制,例如文件大小的限制、文件类型的限制等,确保用户上传的文件符合规定的条件。 6. AJAX上传和回调支持:Bootstrap fileinput支持使用AJAX方式上传文件,并提供了相应的回调函数,可以在上传完成后执行相应的逻辑操作,如显示上传成功的提示信息、更新文件列表等。 综上所述,Bootstrap fileinput提供了一个方便、易用的文件上传功能,并且具备多样化的展示模式、图片预览、文件验证和限制等特点,可以满足用户在网站开发过程中对文件上传的需求。无论是开发响应式网站还是后台管理系统,Bootstrap fileinput都是一个值得考虑和使用的插件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值