canvas教程

足球平台出租:html5 实现客户端验证上传文件的大小(简单实例)

字号+ 作者:H5之家 来源:H5之家 2016-05-21 11:00 我要评论( )

下面小编就为大家带来一篇html5 实现客户端验证上传文件的大小(简单实例)。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

在HTML 5中,现在可以在客户端进行文件上传时的校验了,比如用户选择文件后,可以 马上校验文件的大小和属性等。本文章向码农介绍html5 如何实现客户端验证上传文件的大小,感兴趣的码农可以参考一下。

在HTML 5中,现在可以在客户端进行文件上传时的校验了,比如用户选择文件后,可以马上校验文件的大小和属性等,这其实时得益于浏览器端新增的对文件的校验能力,其中支持HTML 5的浏览器,都会实现W3C实现的文件API标准,其中可以读取客户端文件的各种信息和参数足球平台出租。

下面的例子如下,首先是HTML

XML/HTML Code复制内容到剪贴板

  •   
  • 这里data-file_type属性中,指定了文件的类型,接受ZIP,PNG文件,用|分隔开来,其中data-max-size指定文件的大小,这里是1MB。然后使用jquery 进行判断

    JavaScript Code复制内容到剪贴板

    在上面的代码中, var mimes = get_mimes(file_types); 其实是一个方法足球平台出租,如下: 

    JavaScript Code复制内容到剪贴板

    这里其实就是将ZIP,PNG这样的类型传入,然后返回一个这类文件对应的MIME/TYPE,比如定义一个 mime_types数组,如下:

    JavaScript Code复制内容到剪贴板

    重点关注的是HTML 5中,新的文件API,可以在客户端马上判断文件类型,如下: 

    XML/HTML Code复制内容到剪贴板

    详细的关于HTML 5文件上传的,见: 

    以上这篇html5 实现客户端验证上传文件的大小(简单实例)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家足球平台出租。

    原文地址:

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    • html5canvas核心技术图形、动画与游戏开发源码

      html5canvas核心技术图形、动画与游戏开发源码

      2017-05-02 17:42

    • 打印html5中Canvas的方法

      打印html5中Canvas的方法

      2017-05-01 15:03

    • HTML5+Canvas调用手机拍照功能实现图片上传(下)

      HTML5+Canvas调用手机拍照功能实现图片上传(下)

      2017-04-30 17:00

    • HTML5新特性详解(三)

      HTML5新特性详解(三)

      2017-04-30 16:03

    网友点评