html设置文件上传类型,如何设置在选择文件的时候只能选图片?

html设置文件上传类型,如何设置在选择文件的时候只能选图片?,第1张

可以直接设置input标签的accept属性来限制上传文件的类型

<input type="file" accept="application/msword" ><br><br>accept属性列表<br>12

1.accept=”application/msexcel”

2.accept=”application/msword”

3.accept=”application/pdf”

4.accept=”衡旁application/poscript”

5.accept=”application/rtf”

6.accept=”application/x-zip-compressed”

7.accept=”audio/basic”

8.accept=”audio/x-aiff”

9.accept=”audio/x-mpeg”

10.accept=”audio/x-pn/realaudio”

11.accept=”audio/x-waw”

12.accept=”image/gif”

13.accept=”image/jpeg”咐档橡

14.accept=”image/tiff”

15.accept=”image/x-ms-bmp”

16.accept=”image/x-photo-cd”

17.accept=”image/x-png”

18.accept=”image/x-portablebitmap”

19.accept=”image/x-portable-greymap”

20.accept=”image/x-portable-pixmap”

21.accept=”image/x-rgb”

22.accept=”text/html”

23.accept=”text/plain”

24.accept=”video/quicktime”

25.accept=”video/x-mpeg2”

26.accept=”video/x-msvideo”

如果限制上传蠢吵的文件为图片格式,则可以直接写成:accept = ‘image/*’;

可以设置一下html中的accept属性以实现上传文件类型的筛选,accept 属性只能与 <input type="file">配合使用。它规定能够通过文件上传进行提交的文件类型。

工具原料:编辑器、浏览器

1、设置一个文件上传选项,删选一下只能上传渣拦手图片或者详细的限制只能上如嫌传图片的某些格式,代码如下:

<!DOCTYPE html>

<html>

<body>

<form action="demo_form.asp">

  <input type="file" name="pic" accept="image/*">

  <input type="submit">

</form>

<p><strong>注释:</strong>Internet Explorer 9 以及更早的版本不支持 input 标签的 accept 属性。</p>

<p><strong>注释:</strong>鉴于安全考虑,该例不允许您上传文件。</p>

</body>

</html>

2、运行的结果是只能上传图片不能上传其他的文件,在d出的衡没上传选择对话框中也会值显示图片,如下图:

从技术角度看,你只需要在input控件中标注multiple标签就够了

以下就是演示代码:

<!DOCTYPE html>

<html>

<head>

<title>

Solution 4-5: Sending multiple files

</title>

</head>

<body>

<form id="myForm">

<fieldset>

<渗袭legend>Solution 4-5: Sending multiple files</legend>

<label>Upload one or more files:</label>

<input type="file" name="multipleFileUpload" multiple />

</fieldset>

</form>

</body>

</html>

重要心得

用户选择的多个文件丛闹兄传递到服务端后将会被服务端的编程语言去处理的。有些编程语言,比如PHP需要你为name标签的字符添加方括号来支持传输多个文件。

1<input name="filesUploaded[]" type="file" multiple 弯丛/>

这样,PHP将构造一个数据类型的数组,来容纳一个个上传到服务器的文件。相反如果你在HTML标签中不适用方括号的话,PHP将仅仅只接受到最后一个文件。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/12160423.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-21
下一篇 2023-05-21

发表评论

登录后才能评论

评论列表(0条)

保存