登录 
欢迎来到陈冬冬(雪地里走)的学习天地 | 经验分享整理平台 | 陈冬冬
 服务器本次启动于:24天前 

Bootstrap实践之文件上传插件

2020-04-19 01:48:18 阅读:()

bootstrap-fileinput插件属实非常强大,使用它可以实现非常好的文件上传体验,要说强大到什么程度呢,那就是强大到它的示例如果我详细整理那恐怕得花费我很久很久的业余时间,官网都有案例,我在此处分享一个包含官网basic中所有(不限于)知识点的示例.

另外要说的是该插件默认采用了不免费的Glyphicons图标库,所以我很费劲的将示例中使用到的图标库给换成了基于font-awesome-4.7的图标库,一边是还需要熟悉fileinput的API,一边也要找图标,所以还是比较费劲的。

小技巧

① 需要限制文件上传类型可以使用html5的input自带的限制属性,它将在选择文件处生效,直接根据后缀名过滤,优于代码中的选择不符合的格式的提示效果。

② 选择后的文件上传可以不必采用fileinput组件提供的实现,也可以自己采用ajax效果上传。

③ html5的input自带多选文件multiple实现,所以如果设置有该属性,则它的每个input-file框都将是一个数组对象,不同于早期html4.0(xhtml1.0)时的多文件上传时通过复制多个input-file元素来实现。




你可能感兴趣的:
      关键字:input(4)fileinput(3)html(3)图标库(3)bootstrap(2)
      互动()
      评论()
      比起点赞,站长更喜欢登录后的评论
      • 0
      • 0
      • 0
      • 0
      • 0