html上传文件类型
Ⅰ HTML文件上传
使用 input ,指定类型为 file ,来完成文件上传功能。
多文件上传需要在标签上添加 mulyiple 属性:
使用 accept 属性来限制上传文件的类型,当然这么做任然是不可靠的,还需要后端做进一步的判断。
如果我们是用户,当我们上传了一张图片,却只显示了几个文字,是不是很不爽,那我们怎么来实现预览功能呢?
我们可以使用 FileReader 将图像转换为二进制字符串,然后添加 load 事件监听,在文件上传成功后获取二进制字符串。
显示文件上册进度 来提高用户体验
FileReader 还有一个 progress 事件,表示当前上传进度,配合HTML5的 progress 标签,我们来模拟一下文件的上传进度。
Ⅱ 只使用html 怎样实现 上传文件
<!--STATUS OK-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>只使用html 怎样实现 上传文件?_网络知道 </title><link rel="alternate" type="application/rss+xml" title="“只使用html 怎样实现 上传文件?”的最新回答(RSS 2.0)" href="http://..com/q?ct=20&qid=68168077&pn=65535&rn=25&tn=rssqb">
<link href="/ikqb.css" rel="stylesheet" type="text/css">
</head>
<body><form action="http://localhost/UpLoadFile/Default.aspx" method="post" enctype ="multipart/form-data" runat="server">
<input id="File1" runat="server" name="UpLoadFile" type="file" />
<input type="submit" name="Button1" value="Button" id="Button1" />
</form>
</body>
</html>
然后保存到1.html 这个页面时静态页面。但是只能提交到动态页面去处理
后台页面是asp.net。
处理的页面时
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
if (Request.Files.Count >= 1)
{
HttpPostedFile postedFile = Request.Files[0];
string fileName, fileExtension;
fileName = System.IO.Path.GetFileName(postedFile.FileName); //文件名称
if (fileName != "")
{
fileExtension = System.IO.Path.GetExtension(fileName); //上传文件的扩展名
string new_filename = DateTime.Now.ToString("yyyyMMddHHmmss") + fileExtension; //给文件重新命名
//postedFile.FileName: 客户端文件地址
//postedFile.ContentType.ToString(): 上传的文件类型
//保存文件到文件夹,地址是当前页面的同一级目录下的files文件夹中
postedFile.SaveAs("D:\\file\\" + new_filename);
//.....可以把文件的相应信息保存到数据库中去。
//Response.Write("success");
Response.Redirect("reslut.aspx?result=true");
}
else
{
//Response.Write("false");
Response.Redirect("reslut.aspx?result=false");
}
}
}
}
Ⅲ 上传MIME类型text/html 问题
手动设颤晌置一下茄谨锋 Content-Type:
java">filePost.setRequestHeader("Content-Type","晌祥text/html");
Ⅳ html input标签 file类型,上传的具体是什么东西
上传你选择的文件和相关信息。x0dx0a在 HTML 文档中 标签每出现一升御哗次,一个 FileUpload 对象就会被创建。x0dx0a该元素包含一个文本输入字段,用来输入吵行文件名,还有一个按钮,用来打开文件选择对话框以便图形化选择文件。x0dx0a该元素的 value 属性保存了用户指定的文件的名称,但是当包含一个 file-upload 元素的表单被提交的时候,浏览器会向服务器发送选中的文件的内容而不仅仅是发送拆衫文件名。
Ⅳ html上传文件代码
在HTML标准中,XMLHttpRequest对象被重新定义,被称为“XMLHttpRequest Level 2”,其中包含了以下5个新特性:
1、支持上传、下载字节流,比如文件、blob以及表单数据。
2、增加了上传、下载中的进度事件。
3、跨域请求的支持。
4、允许发送匿名请求(即不发送HTTP的Referer部分)。
5、允许设置请求的超时。
在这篇教程中,我们主要关注第一和第二项特性,尤其是第二项——它能够提供我们想要的上传进度。和之前的方案不同,这个方案并不要求服务器作出特殊的设置,因此大家边看教程就可以边动手试试了。
上面图示的就是我们能够实现的内容:
1、显示上传的文件信息,比如文件名、类型、尺寸。
2、一个能够显示真实进度的进度条。
3、上传的速度。
4、剩余时间的估算。
5、已上传的数据量。
6、上传结束后服务器返回的响应。
另外,凭借XMLHttpRequest,我们的上传过程整个都是异步的,因此用户在上传文件的时候,依然可以操作网页当中的其它元素,并不需要专门等待上传的完成。而在上传结束后,我们能够获取服务器发回的响应,因此整个上传过程都显得相当顺理成章。
Ⅵ 怎么通过HTML+php上传文件到服务器
HTML代码:
<body>
<form action="" method="post" enctype="multipart/form-data" name="upload_form">
<label>选择图片文件</label>
<input name="imgfile" type="file" accept="image/gif, image/jpeg"/>
<input name="upload" type="submit" value="上传" />
</form>
</body>
PHP代码:
if (isset($_FILES['imgfile'])
&& is_uploaded_file($_FILES['imgfile']['tmp_name']))
{
$imgFile = $_FILES['imgfile'];
$upErr = $imgFile['error'];
if ($upErr == 0)
{
$imgType = $imgFile['type']; //文件类型。
/* 判断文件类型,这个例子里仅支持jpg和gif类型的图片文件。*/
if ($imgType == 'image/jpeg'
|| $imgType == 'image/gif')
{
$imgFileName = $imgFile['name'];
$imgSize = $imgFile['size'];
$imgTmpFile = $imgFile['tmp_name'];
/*
将文件从临时文件夹移到上传文件夹中。
注意:upfile这个文件夹必须先创建好,不然会报错。
*/
move_uploaded_file($imgTmpFile, 'upfile/'.$imgFileName);
/*显示上传后的文件的信息。*/
$strPrompt = sprintf("文件%s上传成功<br>"
. "文件大小: %s字节<br>"
. "<img src='upfile/%s'>"
, $imgFileName, $imgSize, $imgFileName
);
echo $strPrompt;
}
else
{
echo "请选择jpg或gif文件,不支持其它类型的文件。";
}
}
else
{
echo "文件上传失败。<br>";
switch ($upErr)
{
case 1:
echo "超过了php.ini中设置的上传文件大小。";
break;
case 2:
echo "超过了MAX_FILE_SIZE选项指定的文件大小。";
break;
case 3:
echo "文件只有部分被上传。";
break;
case 4:
echo "文件未被上传。";
break;
case 5:
echo "上传文件大小为0";
break;
}
}
}
else
{
}
Ⅶ html设置文件上传类型,如何设置在选择文件的时候只能选图片
可以直接设置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/*’;
Ⅷ input type="file" 理解
if(e.target.accept != 'image/png'){
return alert(' 即使input标签上已经有accept格式的显示,但在用户上传可以从所有文件中选其他格式的文件,所以第二次处理格式 ’)
}
if(e.target.files[0].size >1024*1024*1){
return alert('上传文件不能大于1M')
}
if(e.target.files.length>1){
return alert('只能上传1个文件')
}
var url = window.webkitURL.createObjectURL(file) ; // 上帆笑基传图片预览路径
每个file对象包含以升汪下属性:
lastModified:数值,表示最近一次修改时间的毫秒数;
lastModifiedDate:对象,表示最后一次表示最近一次修改时间的Date对象(高程中说是字符串,根据上图可看出应该为对象,为了层级清晰未对其展开,大家可自行查看,其可调用Date对象的有关方法,例如getDay方法);
name:本地文件系统中的文件名;
size:文件的字节大小;
type:字符串,文件的MIME类型; --> 上传文件类型<input accept="文件类型" type="file">
weblitRelativePath:此处为空;当在input上加上webkitdirectory属性时,用户可选择文件夹,此时weblitRelativePath表示文件夹中文件的相对路径 比如:
FileReader是一种态谨异步文件读取机制,结合input:file可以很方便的读取本地文件。我们可以通过html5提供的FileReader读取到文件中的数据。
参考博客: https://www.cnblogs.com/youhong/p/7221080.html?utm_source=itda&utm_medium=referral
参考博客: https://www.cnblogs.com/fozero/p/8835628.html
Ⅸ html 表单中 上传 文件格式
如果post中没有收到文件而收到了其他的提交数据,那么可以确定为文件没有上传。
但因为问题描述比较抽象所以原因有很多,比如不通过控件而直接填写文件路径在部分浏览器里不兼容,比如浏览器安全策略不允许脚本(js)控制提交等等。