baozhangfang/WebRoot/WEB-INF/jsp/exchangeHouse/exchangeContractUpload.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<script type="text/javascript">
	
	var upload_load =function(id){
		$.ajax({
            type: "post",//使用get方法访问后台
            dataType: "json",//返回json格式的数据
            url: "exchangeHouseAction_findById",//要访问的后台地址
            data: "exchangeHouse.id="+id,//要发送的数据
            success: function(msg){
                for(var i=0;i< msg.obj.agreementFile.length;i++){
                    var $image = $("<div style='width: 120px;height: 80px;float:left;'><a target='_blank' href='" + msg.obj.agreementFile[i].filePath + "'><img src='" + msg.obj.agreementFile[i].filePath + "' width='120' height='80'/></a><img src='images/de.png' id='img" + msg.obj.agreementFile[i].id + "' onclick='removeImg(" + msg.obj.agreementFile[i].id + ")' width='15' height='15' style='float: right;position: relative;top: -77px;right: 2px; cursor:pointer;'></div>");
                    $("#agreementFile_upload_file").append ($image);
                }
            }
        })
            
	$("#id_pickUp").val(id);
		$("#agreementFile_upload").change(function(){
            var obj = document.getElementById('agreementFile_upload');
            if(imageFormat(obj)){
                $("#exchangeHouseFileForm").form('submit',{
                    url :whzl.basePath+'/exchangeHouseAction_addUploadFile',
                    success :　function(result){
                        $("#agreementFile_upload").attr("value","");
                        $.ajax({
                            type: "post",//使用get方法访问后台
                            dataType: "json",//返回json格式的数据
                            url: "exchangeHouseAction_findById",//要访问的后台地址
                            data: "exchangeHouse.id="+id,//要发送的数据
                            complete :function(){$("#load").hide();},//AJAX请求完成时隐藏loading提示
                            success: function(msg){
                                $("#agreementFile_upload_file").children('div').remove();
                                for(var i=0;i< msg.obj.agreementFile.length;i++){
                                    var $image = $("<div style='width: 120px;height: 80px;float:left;'><a target='_blank' href='" + msg.obj.agreementFile[i].filePath + "'><img src='" + msg.obj.agreementFile[i].filePath + "' width='120' height='80'/></a><img src='images/de.png' id='img" + msg.obj.agreementFile[i].id + "' onclick='removeImg(" + msg.obj.agreementFile[i].id + ")' width='15' height='15' style='float: right;position: relative;top: -77px;right: 2px; cursor:pointer;'></div>");
                                    $("#agreementFile_upload_file").append ($image);
                                }
                            }
                        });
                    }
                });
            }
        });
	}
	
	function imageFormat(obj){
		var files = obj.files;
			for(var i=0;i<files.length;i++){
				/**判断图片格式*/
				if(!/\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(files[i].name)){ 
					$.messager.alert('提示','图片类型必须是.gif,jpeg,jpg,png中的一种'); 
					return false;  
				}
				/**判断图片大小*/
				if(files[i].size>3000*1024){
					$.messager.alert('提示','单张图片不得大于3M。');
					return false;
				}
			}
		return true;
	}
	
    //删除图片
	var removeImg = function(id){
		$.messager.confirm('提示', '确定删除么?删除后将无法恢复', function(r){
			if (r){
				 $("#img" + id).parent().remove();
				 $.ajax({
				    type: "post",//使用post方法访问后台
				    dataType: "json",//返回json格式的数据
				    url:whzl.basePath + "/uploadFileAction_deleteUploadFile",
				    data:{
				    	"uploadFile.id":id
				   	},
				    error: function(msg){//msg为返回的数据，在这里做数据绑定
						$.messager.alert("提示","删除失败！");	
				    }
				});
			}
		});
	}

</script>
<div class="easyui-tabs" id="tabs_upload">
	<div title="合同文件上传"  id="fyxx_upload">
		<form id="exchangeHouseFileForm" method="post" enctype="multipart/form-data">
				<table class="mytable" style="width: 100%;" id="department_table">
					<tr id="agreementFile_tr">
                        <th width = "20%">协议书上传<input id="id_pickUp" name="exchangeHouse.id" type="hidden"/></th>
                        <td width = "80%">
                            <div>
                                <input type="button" value="上传" onclick="agreementFile_upload.click()">
                                <input type="file" accept="image/gif, image/jpeg" name="agreementFile" id="agreementFile_upload" style="float:left; width:0px;display: none" >
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td id="agreementFile_upload_file" colspan="2" height=110></td>
                    </tr>
				</table>
		</form>
	</div>
</div>