当前位置: 代码迷 >> 综合 >> 笔记整理-swfupload使用实例
  详细解决方案

笔记整理-swfupload使用实例

热度:6   发布时间:2023-09-19 12:27:03.0
<!-- 基本JQuery,版本建议1.10以后 -->
<script src="js/jquery.js"></script>
<!-- 文件上传插件 -->
<link href="<%=basePath%>js/swfupload/css/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=basePath%>js/swfupload/swfupload.js"></script>
<script type="text/javascript" src="<%=basePath%>js/swfupload/swfupload.queue.js"></script>
<script type="text/javascript" src="<%=basePath%>js/swfupload/fileprogress.js"></script>
<script type="text/javascript" src="<%=basePath%>js/swfupload/handlers.js"></script><script type="text/javascript">
var swfu;
var accTotalCount = 0;$(function () {var settings = {  flash_url : "js/swfupload/swfupload.swf",upload_url:  "<%=basePath%>docbase/AttachmentsSwfupload_submitAttachment.do?jsessionid:<%=request.getSession().getId()%>&r="+Math.random(),post_params: {},file_post_name: "file",file_size_limit: "100 MB",file_types :  可以上传的问文件的的后缀,
//*.doc;*.docx;*.ppt;*.pptx;*.xls;*.xlsx;*.pdf;*.ceb;*.sep;*.gd;*.txt;*.zip;*.rar;*.jpg;*.gif;*.bmp;*.png,*.jpg;*.giffile_types_description : "常见文件类型",file_upload_limit : 10,  //配置上传个数file_queue_limit : 0,custom_settings : {progressTarget : "fsUploadProgress",cancelButtonId : "btnCancel"},debug: false,// Button settingsbutton_image_url: "js/swfupload/images/blueBtn.png",button_width: 100,button_height: 30,button_placeholder_id: "spanButtonPlaceHolder",button_text: '<span class="theFont">   选择</span>',button_text_style: ".theFont { font-size:14; color:#ffffff; float:left;}",button_text_left_padding: 20,button_text_top_padding: 3,button_cursor: SWFUpload.CURSOR.HAND,button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,file_queued_handler : fileQueued,file_queue_error_handler : fileQueueError,file_dialog_complete_handler : fileDialogComplete,upload_start_handler : uploadStart,upload_progress_handler : uploadProgress,upload_error_handler : uploadError,upload_success_handler : myUploadSuccess,upload_complete_handler : uploadComplete,queue_complete_handler : myQueueComplete}; swfu = new SWFUpload(settings);
});function myUploadSuccess(fileObject, serverData) {try {var progress = new FileProgress(fileObject, this.customSettings.progressTarget);progress.setComplete();progress.setStatus("上传成功");progress.toggleCancel(false);} catch (ex) {this.debug(ex);}var arr = serverData.split(",");var fjId = arr[0];var className = "";var fjName = arr[1];var rowHtml = '<tr id="acc_tr_' + fjId + '" style="height:60px;" >' +'<td width="10px">' +'<input name="acc" type="checkbox" value="' + fjId + '" />' +'</td>' +'<td align="left" >' +'<a href="javascript:void(0)" οnclick="doEdit(' + fjId + ');">'  + fjName +'</a>' +								'</td>' +									'</tr>';$("#Tab").append(rowHtml);$("#acc_tr_0").remove();
}function myQueueComplete(numFilesUploaded) {accTotalCount = calcAccCount();$("#divStatus").html('共上传' + accTotalCount + '个文件,本次上传' + numFilesUploaded + '个文件。');
}/**
* 计算附件总数
*/
function calcAccCount() {accTotalCount = $("input[name='acc']").length;return accTotalCount;
}function deleteFiles() {var fjIdArr = [];$("input[name='acc']:checked").each(function() {fjIdArr.push(this.value);});if (fjIdArr.length < 1) {alert("请选择要删除的附件!");return;}if (confirm("你确定要删除所选文件吗?")) {var url = "<%=basePath%>docbase/AttachmentsSwfupload_deleteAttachment.do?fjIdArr="+fjIdArr;$.ajax({url: url,type: "get",async: false,timeout: 20000,success: function(ret) {if(ret == 'ok') {$('#divOffice').hide();for(var i = 0; i < fjIdArr.length; i++) {$("#acc_tr_" + fjIdArr[i]).remove();}$("#divStatus").html("成功删除" + fjIdArr.length + "个附件!");} else {alert("delete error!");}},error: function() {alert("delete error!");}});}
}function chAll() {if ($("#chAll").prop("checked")) {$("input[name='acc']").each(function () {this.checked = true;});} else {$("input[name='acc']").each(function () {this.checked = false;});}
}
</script><table border="0" cellpadding="0" cellspacing="0"><tr><th colspan="2">附件列表</th></tr><tr><th><input id="chAll" name="chAll" type="checkbox" οnclick="chAll()"/></th><th>文件名称</th></tr><tbody id="Tab"><s:if test="attachmentList == null || attachmentList.size < 1"><tr id="acc_tr_0" ><td align="center"  colspan="2">暂无附件。</td></tr></s:if><s:else><s:iterator value="attachmentList" status="stat" id="attachment"><tr id="acc_tr_<s:property value="#attachment.id" />" ><td align="center" width="10px"><input name="acc" type="checkbox" value="<s:property value="#attachment.id" />" /></td><td align="left" style="padding-top: 8px;padding-bottom: 8px;"><a href="javascript:void(0)" οnclick="doEdit('<s:property value='#attachment.id'/>');"><s:property value="#attachment.fileName" /></a></td></tr></s:iterator></s:else></tbody>
</table>
<br />
<div style="padding: 6px 0 0 2px;"><input class="input_bt" οnclick="deleteFiles()" type="button" value="删除" style="width: 100px; height: 30px; float: left;"/><span id="spanButtonPlaceHolder"></span>
</div>
<span id="fsUploadProgress" style="display;"></span>
<div id="divStatus" style="padding-left: 4px; margin-top: 4px;"></div>
<span id="btnCancel" style="display: none;"></span>
实际使用过程中需要注意请求的地址可能会被拦截,可以将sessionID作为请求参数,加上随机串一同请求。同时需要注意swfupload在win10的IE11下会出现问题,由于所在项目支持为IE8,未对win10的IE11进行兼容,但是win7的IE11未发现问题。