| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 6322 人关注过本帖
标题:HTML无法上传文件,求修复一下。
取消只看楼主 加入收藏
yuma
Rank: 12Rank: 12Rank: 12
来 自:银河系
等 级:贵宾
威 望:37
帖 子:1933
专家分:3012
注 册:2009-12-22
结帖率:89.13%
收藏
 问题点数:0 回复次数:0 
HTML无法上传文件,求修复一下。
完整代码如下:

程序代码:
<html> 
<head> 
<meta charset="utf-8"> 
<title>进度条测试</title> 
<script type="text/javascript" src="https://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> 
</head> 
<body> 

 

 <input type="file" id="file_upload"/> 

 <input type="button" value="上传" id="upload"/> 

 <div style="background:#848484;width:100px;height:10px;margin-top:5px"> 

 <div id="progressNumber" style="background:#428bca;width:0px;height:10px" > 

 </div> 

 </div> 

 <font id="percent">0%</font> 
</body> 
<script> 
var file = null; 
$(function(){ 

 $("#upload").click(function(){ 

 upload(); 

 }); 
}); 
var input = document.getElementById("file_upload"); 

 
//文件域选择文件时, 执行readFile函数 
input.addEventListener('change',readFile,false); 

 
function readFile(){ 

 file = this.files[0]; 
} 
//上传文件 
function upload(){ 

 var xhr = new XMLHttpRequest(); 

 

 var fd = new FormData(); 

 

 fd.append("fileName", file); 

 

 //监听事件 
 xhr.upload.addEventListener("progress", uploadProgress, false); 

 

 //发送文件和表单自定义参数 
 xhr.open("POST", "./Upload",true); 

 

 xhr.send(fd); 

 } 

 

 function uploadProgress(evt){ 

 if (evt.lengthComputable) {   
  //evt.loaded:文件上传的大小 evt.total:文件总的大小   
  var percentComplete = Math.round((evt.loaded) * 100 / evt.total); 
  //加载进度条,同时显示信息  
  $("#percent").html(percentComplete + '%') 
  $("#progressNumber").css("width",""+percentComplete+"px");  

 } 

 } 
</script> 
</html> 
搜索更多相关主题的帖子: HTML 文件 upload var function 
2021-01-10 09:40
快速回复:HTML无法上传文件,求修复一下。
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.014350 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved