怎样用easyUI实现照片上传和预览

图片说明

就像实现这种格式和功能的easyUI 代码 求大神指教

easyui js 上传图片加预览功能

easyui form提交文件(上传图片和文件)

多谢各位朋友帮助 现在问题已经解决 贴出自己的代码
/**

  • 上传应用图片 / var pathname = window.location.pathname; $("#addApp_iconblob").uploadify({ 'auto': false, 'swf': pathname+'resources/plugins/uploadify/uploadify.swf', 'uploader': 'upload/uploadFile;jsessionid='+_JSESSIONID, //后台处理程序的相对路径 'buttonText': '选择文件', 'fileTypeDesc':'不超过1M的图片 (.gif;*.jpg;*.png;*jpeg;)', 'fileSizeLimit': '1024KB', //允许上传的文件大小(kb) 此为1M 'fileTypeExts':'*.gif;*.jpg;*.png;*.jpeg', 'width':60,//浏览按钮的宽和高 'height':24, 'overrideEvents' : ['onDialogClose', 'onSelectError','onUploadSuccess'], 'onUploadError':function(file, errorCode, errorMsg, errorString){ $.messager.alert('消息',"图片" + file.name + " 上传失败!"); }, 'onUploadStart': function (file) {
    $("#addApp_iconblob").uploadify("settings", "formData", { 'appid': $('#addApp_id').val() }); //在onUploadStart事件中,也就是上传之前,把参数写好传递到后台。
    }, 'onUploadComplete': function(file, data, response) {//当单个文件上传完成后触发 setTimeout("addApp_cancelOK()","1000"); }, 'onSelect' : function(file) { $('#addApp_appicon').val(file.name); }, 'onUploadSuccess' : function(file, data, response) { $('#' + file.id).find('.data').html(' - 完成'); }, 'onDialogClose' : function(filesSelected, filesQueued, queueLength) { if (this.queueData.filesErrored > 0) { $.messager.alert('消息',"图片" + uploadErrorMsg + " 取消上传!"); } }, 'onSelectError' : function(file, errorCode, errorMsg) { var settings = this.settings; switch(errorCode) { case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED: uploadErrorMsg = '\n文件数量超过上传限制 '; break; case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT: uploadErrorMsg = '\n文件 "' + file.name + '" 超过大小限制 (' + settings.fileSizeLimit + ')'; break; case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE: uploadErrorMsg = '\n文件 "' + file.name + '" 大小为0'; break; case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT: uploadErrorMsg = '\n文件 "' + file.name + '" 类型不接受 (' + settings.fileTypeDesc + ')'; break; } } }); $("#updateApp_iconblob").uploadify({ 'auto': false, 'swf': pathname+'resources/plugins/uploadify/uploadify.swf', 'uploader': 'upload/uploadFile;jsessionid='+_JSESSIONID, //后台处理程序的相对路径 'buttonText': '选择文件', 'fileTypeDesc':'不超过1M的图片 (*.gif;*.jpg;*.png;*.jpeg)', 'fileSizeLimit': '1024KB', //允许上传的文件大小(kb) 此为1M 'fileTypeExts':'*.gif;*.jpg;*.png;*.jpeg', 'width':60,//浏览按钮的宽和高 'height':24, 'overrideEvents' : ['onDialogClose', 'onSelectError','onUploadSuccess'], 'onUploadError':function(file, errorCode, errorMsg, errorString){ $.messager.alert('消息',"图片" + file.name + " 上传失败!"); }, 'onUploadComplete': function(file, data, response) {//当单个文件上传完成后触发 setTimeout("updateApp_cancelOK()","1000"); }, 'onUploadStart': function (file) {
    $("#updateApp_iconblob").uploadify("settings", "formData", { 'appid': $('#update_id').val() }); //在onUploadStart事件中,也就是上传之前,把参数写好传递到后台。
    }, 'onSelect' : function(file) { $('#updateApp_appicon').val(file.name); }, /* 'onUploadSuccess' : function(file, data, response) { $('#' + file.id).find('.data').html(' - 完成'); },*/ 'onDialogClose' : function(filesSelected, filesQueued, queueLength) { if (this.queueData.filesErrored > 0) { $.messager.alert('消息',"图片" + uploadErrorMsg + " 取消上传!"); } }, 'onSelectError' : function(file, errorCode, errorMsg) { var settings = this.settings; switch(errorCode) { case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED: uploadErrorMsg = '\n文件数量超过上传限制 '; break; case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT: uploadErrorMsg = '\n文件 "' + file.name + '" 超过大小限制 (' + settings.fileSizeLimit + ')'; break; case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE: uploadErrorMsg = '\n文件 "' + file.name + '" 大小为0'; break; case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT: uploadErrorMsg = '\n文件 "' + file.name + '" 类型不接受 (' + settings.fileTypeDesc + ')'; break; } } });