HTML5 - 限制文件上传(HTML5 - Restrict file upload)

上面的代码也允许上传.txt或任何类型的文件。

如何限制 html5中的其他文件类型 ?

Above code allows to uploading of .txt or any type of file also.

How to restrict other file types in html5?

原文:https://stackoverflow.com/questions/28804095

更新时间:2020-07-11 18:07

最满意答案

使用input属性,您可以指定要上载的任何文件扩展名。 要添加多个属性,请使用逗号分隔它们:

您还可以设置预定义的扩展系列以供上载。 只需使用audio/* , video/*或image/*分别选择这些文件类型。 这些也可以与常规文件扩展名结合使用。 例如

这允许您上传图像或Photoshop文件。

我希望这有帮助!

You can't restrict other file types in html5 file input, if user select other files it allow to select. Attribute 'accept' just give hint to user about supported file types.

相关问答

使用jquery.form插件,可以非常简单地执行您想要的操作: HTML:

...

即使你确实有一个路径(一些浏览器用于给你),也无法设置类型文件的输入路径。 因此,使用普通的JS和DOM无法做到你想要的。 我说这是不可能的,但现在你问我确实有办法,使用新的File API。 以下步骤概述了需要做什么,但没有经过测试,我不希望它能够工作,它只是向您展示方式,全局变量也是坏的,它只是向您展示最简单的方式。 这是一个很好的页面,其中包含使用文件API的示例http://www.html5rocks.com/en/tutorials/file/dndfiles/ 首先您需要输入类型文件

...

所以你要将reader.onload事件设置为一个函数,但是你需要调用reader.readAsText()函数。 例如,将代码更改为: reader.onload = function(event) {

console.log(event);

};

reader.readAsText(file);

这样做的目的是告诉reader ,当你调用reader.readAsText(file)它应该运行你用reader.onload定义的函数。 你以前做过的事情永远不会加载文件,因为你只是告诉读者

...

您无法向JSF页面提交非JSF POST请求。 您需要为非JSF POST请求提供自定义servlet。 您可以在一个密切相关的问题的答案中找到这样一个servlet的具体示例: HTML5文件上传到Java Servlet 。 You can't submit a non-JSF POST request to a JSF page. You need to homegrow a custom servlet for non-JSF POST requests. You can find a c

...

在FormData对象之后这行是什么意思? fd.append("file", document.getElementById('file').files[0]);

document.getElementById('file')通过其ID获取元素。 element.files[0]从元素中获取第一个选定的文件。 fd.append("file", file)将其附加到FormData实例,其字段名称为file 。 稍后将fd作为multi

...

使用input属性,您可以指定要上载的任何文件扩展名。 要添加多个属性,请使用逗号分隔它们:

您还可以设置预定义的扩展系列以供上载。 只需使用audio/* , video/*或image/*分别选择这些文件类型。 这些也可以与常规文件扩展名结合使用。 例如

这允许您上传图像或Photoshop文件。 我希望这有帮助! You can

...

在请求结束时,需要添加仅包含\ r \ n且不包含其他空格的空行。 尝试添加另一个parts.push(''); parts.push('--' + bound + '--');之后parts.push('--' + bound + '--'); 编辑: 首先,我想说你不应该将文件作为原始二进制字符串上传,因为你的二进制数据包含控制字符,这可能会搞砸你的请求并导致文件损坏。 数据应在Base64中编码。 你可以在这里 如果在debug中检查reader.result ,它将包含: data

...

我不确定文件上传是否适用于文件读取器,但有一种不同的方法可以使它工作: var formData = new FormData($(".file_upload_form")[0]);

$.ajax({

url: "upload_file.php", // server script to process data (POST !!!)

type: 'POST',

xhr: function() { // custom xhr

myXhr = $.ajaxSe

...

嗯,我认为有可能,根据JayC回答的这个问题 您所谈论的是HTML5文件API。 我不确定描述它的最佳链接是什么,但这可能有所帮助。 https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications 这个问题也许可以帮到你 Well, I think it is possible, according to this question answered by JayC What you're talking abo

...

我不相信你可以设置内置属性的文件数限制,只有多个或不符合,如: 您可以在前端使用javascript来限制数量并在服务器上进行验证。 我猜这些文件按字母顺序列出,确切的顺序可能与系统有关。 I don't believe you can set a limit to the number of files with a built-in attribute, just multiple or not, like:

...

电脑无法上传html文件类型,HTML5 - 限制文件上传(HTML5 - Restrict file upload)相关推荐

  1. html得到上传文件类型后缀,js获取上传文件后缀名(附js提交form表单)

    js获取上传文件后缀名(附js提交form表单) 代码如下: function check_file() { var strFileName=form1.FileName.value; if (str ...

  2. java web中文件类型,java web项目文件上传中常见的mime类型/文件类型校验、验证/只允许特定类型的文件(基于Apache的tika)...

    java代码 final Tika tika = new Tika(); Set allowMimeTypeAll = ImmutableSet.of("image/pjpeg", ...

  3. Web安全 文件上传漏洞的 测试和利用.(上传一个图片或文件 拿下服务器最高权限.)

    文件上传漏洞的概括 现在大多的网站和Web应用系统都会有上传功能(比如:文档,图片,头像,视频上传等.),而程序员在开发文件上传功能时,没有对代码做严格校验上传文件的后缀和文件类型. 此时攻击者就可以 ...

  4. php图片上传为base64,php实现base64图片上传方式实例代码

    /** * base64图片上传 * @param $base64_img * @return array */ header("content-type:text/html;charset ...

  5. hadoop HDFS的文件夹创建、文件上传、文件下载、文件夹删除,文件更名、文件详细信息、文件类型判断(文件夹或者文件)

    摘要: 本篇文章主要介绍的是hadoop hdfs的基础api的使用.包括Windows端依赖配置,Maven依赖配置.最后就是进行实际的操作,包括:获取远程hadoop hdfs连接,并对其进行的一 ...

  6. element ui upload组件文件上传一次 后,不论是上传成功之后修改文件再上传还是上传失败重新上传,再次点击上传均无反应。

    问题: Element UI Upload 组件文件上传一次 后,不论是上传成功之后修改文件再上传还是上传失败重新上传,再次点击上传均无反应. 原因: 第一次上传文件后,浏览器还保存着我们已经上传的文 ...

  7. php将上传的图片转为base64,html5实现把上传的图片转成base64编码在显示(代码实例)...

    本章给大家介绍html5实现把上传的图片转成base64编码在显示(代码实例).有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助. 首先我们来详细的看一看base64编码: 什么是bas ...

  8. java 批量上传图片插件_java多文件上传plupload控件实现多图片上传(一)

    使用的是plupload-2.1.2 控件.网上资源挺多的,很好下载. plupload 官方地址 : http://www.plupload.com/ plupload 示例: http://www ...

  9. asp无组件上传类的应用实例/化境HTTP上传程序

    原版 upload_5xsoft.inc 文件内容 <SCRIPT RUNAT=SERVER LANGUAGE=VBSCRIPT> dim Data_5xsoft Class upload ...

最新文章

  1. 世界上第一台电子计算机到底是谁发明的?
  2. volatile关键字的作用、原理
  3. 解决layui数据表格table固定列行高不一致的情况
  4. android xml文件格式,android xml 资源文件中几个格式(@ ? @* @+)的含义
  5. Hadoop命令学习
  6. Cocos2D中相关问题提问的几个论坛
  7. 爱尔兰圣三一学院计算机全球排名,QS世界大学学科排名,爱尔兰圣三一学院20个学科进世界百强...
  8. vc++学习精髓(收集,整理)
  9. CLR via C# 之管中窥豹(一)
  10. python static 的用法_Python中static相关知识小结
  11. is 与 as 数据类型的操作 0108
  12. javascript async await
  13. 理解Promise的3种姿势
  14. chaincode java_基于Hyperledger Fabric交易系统帐户的钱包模型的java Chaincode实例
  15. ispostback的坑
  16. Racket编程指南——3 内置的数据类型
  17. MOSS入门介绍 和 概念介绍
  18. 微信发红包如何设计测试用例
  19. JavaScript 学习笔记 - 12 JavaScript 应用示例
  20. 构建基于Linux平台的开源×××服务器

热门文章

  1. [CTSC2008]祭祀river
  2. 【Maven】自定义插件(新建项目开始):AbstractMojo,Mojo,pluginGroups,build,plugin,execution,phase,goals
  3. Linux的基本文件操作及用户管理
  4. 使用web3调用智能合约的简单例子
  5. 解决虚拟机中ubuntu无法识别U盘
  6. 基于STM32F429网络摄像头实现
  7. 【资源】前端优质资源收集
  8. 【路径规划-多式联运】基于遗传算法求解多式联运冷链运输成本优化问题附matlab代码
  9. 个人思考-关于“技多不压身”
  10. 小游戏渠道大盘点,不可错过的流量入口