JS 文件上传/下载

项目需要文件上传/下载想用一个轻量级的框架，但是在网上搜索都没有找到于是想自己手写一个，但是由于浏览器限制不允许获取本地路径（IE除外）所以还是用了框架 ajaxfileupload 超轻量级的

JSP文件

<tr>
 <td>上传附件：</td>
  <td colspan="3">
  <!-- 提交所用到的表单  -->
    <form>
	<!-- 显示上传文件名的文本框 disabled="value" 设置文本框为只读-->
        <input type="text"  disabled="value" name="uploadFile" id="uploadFile" style="width:300px;" class="float" >
        <!-- file 框（原生的太难看，还改变不了样式，所以隐藏掉） 设置的onchange是为了实现自动上传（自动触发ajax） -->
        <input type="file" name="upload_file" id="upload_file"  style="display:none" onchange="changeValue(this);"/>
    </form>  
	<!-- 调取file 框的点击事件  -->
        <a href="#" onclick="$('#upload_file').click()">	
	    <!-- 把一个图片当作按钮显示，主要作用就是好看点 -->
	    <img src="images/jyxc_butll.jpg" type="submit" width="57" height="30" class="jyxc_butll"> <!-- 浏览 -->
	</a>
  </td>
</tr>


//change事件
 function changeValue(e){
    var file = e.files[0];  
    var path=e.value
        //给文本框设置文件名称
         $("#uploadFile").val(file.name);
    
 // 获取FileList的第一个元素
	$.ajaxFileUpload({
              url:,//用于文件上传的服务器端请求地址
              secureuri:false,//一般设置为false
              fileElementId:"upload_file",//文件上传空间的id属性  <input type="file" id="file" name="file" />
              dataType: 'json',//返回值类型 一般设置为json
              success: function (data){
            	  if(data.success){
	            	 URL=data.message;
            	  }else{
            		 alert("图片格式不正确");
            	  }
              },
              error: function (data)//服务器响应失败处理函数
              {
                  alert("服务器异常");
              }
          });
};

以上是文件上传的功能，下面是下载！

下载其实超级简单，但是在网上找的信息很多都是不对的只言片语不知道从哪粘过来的我也是弄了好长时间才搞定，其实就几行代码

JSP
  就是一个a标签

<a  href='#' id="lj" ></a>

如果确定路径，及文件名可以这样写 举个栗子
  <a  href='http://127.0.0.1/test/test/161616116518181.jpg' download="161616116518181.jpg"  id="lj" ></a>
这样浏览器就知道是要下载操作了  href 是地址  download 是文件名 ，但是不是所有浏览器都支持 谷歌支持 火狐会打开文件

JS文件
//$("#lj").attr("href",zc+upload);//$("#lj").attr("download",File);

可以留言交流,一起学习

猜你喜欢