首页 > 代码库 > swfupload多图上传插件(ASP.NET)

swfupload多图上传插件(ASP.NET)

   <script src="../js/swfupload/swfupload.js" type="text/javascript"></script>    <script src="../js/swfupload/swfupload.queue.js" type="text/javascript"></script>    <script src="../js/swfupload/fileprogress.js" type="text/javascript"></script>    <script src="swfMgr/handlers.js" type="text/javascript"></script>   <tr <%=tp_addList %> id="tp_addList">                <td class="left_title_2" width="100px">                    上传图片列表:                </td>                <td id="Td1">                    <%--上传多个图片--%>                    <div align="left">                        <input id="middleImg" /><span style="color: Red;">注明:图片以(655*500),单个文件最大5000KB;默认设置最后一张为首页图片,图片名不能重复,一张张按照顺序上传</span>                        <p id="fileQueue2" style="width: 320px; margin: 0 auto;">                        </p>                        <ul id="ulList">                        </ul>                    </div>                </td>            </tr> <asp:HiddenField ID="hidStr" runat="server" Value="" />  <asp:HiddenField ID="hidFolder" runat="server" Value="0" />    <script type="text/javascript">        var tmpFolder = $("#hidFolder").val();        var tmpNum = 0;        var tmpTotal = 0;        function uploadSuccessOther(file, serverData) {            try {                var progress = new FileProgress(file, this.customSettings.upload_target);                progress.setComplete();                progress.setStatus("正在上传!");                progress.toggleCancel(false);            } catch (ex) {                //alert(ex.message);            }            //成功后,处理            $("#ulList").append(<li><table><tbody><tr><td><img width="100" src="http://www.mamicode.com/img/ + tmpFolder + /100/ + serverData + "></td></tr><tr><td><label><input type="radio" class="setIndex" style="margin-right: 5px;" name="rdo" value="http://www.mamicode.com/ + serverData + ">首页显示</label>&nbsp;<a style="color: Red;" href="javascript:;" class="delImg">删除</a></td></tr></tbody></table></li>);            $("#info_tp_add").val(serverData); //隐藏图片路径            tmpTotal += 1;            if (tmpNum == tmpTotal) {                $(".ajaxloading").hide();                window.onbeforeunload = function() { };                $(".saveClass").removeAttr("disabled", "disabled");            }        }        function fileDialogCompleteOther(numFilesSelected, numFilesQueued) {            try {                tmpNum = parseInt(numFilesQueued);                if (tmpNum > 0) {                    this.startUpload();                    $("#divLoading").css({ height: $(window).height() + 150 + tmpNum * 50 });                    $(".ajaxloading").css({ top: $(window).scrollTop() + 150 }).show();                    //  $(".saveClass").attr("disabled", "disabled"); //在上传过程中将保持按钮禁用                    //  window.onbeforeunload = function() { return ("确认离开当前页面吗?未保存的数据将会丢失!"); }                } else {                }            } catch (ex) {                //this.debug(ex);            }        }        //        var swfMiddle;        window.onload = function() {            swfMiddle = new SWFUpload({                // Backend Settings                upload_url: "swfMgr/Handler.ashx",                post_params: {                    ASPSESSID: <%=Session.SessionID %>,                    Folder: tmpFolder,                    t: i                },                // File Upload Settings                file_size_limit: "5000",                file_types: "*.jpg;*.png",                file_types_description: "JPG,PNG",                file_upload_limit: 0,    // Zero means unlimited                swfupload_preload_handler: preLoad,                swfupload_load_failed_handler: loadFailed,                file_queue_error_handler: fileQueueError, //队列错误                file_dialog_complete_handler: fileDialogCompleteOther,                upload_progress_handler: uploadProgress,                upload_error_handler: uploadError,                upload_success_handler: uploadSuccessOther,                upload_complete_handler: uploadComplete,                // Button settings                button_image_url: "../js/swfupload/buttons/XPButtonNoText_61x22.png",                button_placeholder_id: "middleImg",                button_width: 61,                button_height: 22,                button_text: <span class="button">添加图片<span class="buttonSmall"></span></span>,                button_text_style: .button { font-family: Helvetica, Arial, sans-serif; font-size: 12px;font-weight:bold;} .buttonSmall { font-size: 12px; },                button_text_top_padding: 1,                button_text_left_padding: 5,                button_cursor: SWFUpload.CURSOR.HAND,                button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,                // Flash Settings                flash_url: "../js/swfupload/swfupload.swf", // Relative to this file                flash9_url: "../js/swfupload/swfupload_FP9.swf", // Relative to this file                custom_settings: {                    upload_target: "fileQueue2"                }                //图片上传            });        }            </script>    <script type="text/javascript">        $(function() {            //删除该上传图片            $(document).delegate(".delImg", "click", function() {                if ($(this).prev().find("input").attr("checked")) {                    alert(已经设置首页的图片无法删除!);                    return false;                }                if (!confirm("确定要删除这张图片吗?")) return false;                var tmpLi = $(this).parents("li").eq(0);                $.post("swfMgr/fileMgr.ashx", {                    t: "del",                    f: $("#hidFolder").val(),                    n: $(this).prev().find("input").val()                }, function(rdata) {                    if (rdata = "1") {                        tmpLi.remove();                    }                });            });            //首页显示            $(document).delegate(".setIndex", "click", function() {                var value = $(this).val();                if (!confirm("确定要设置这张图片首页显示吗?")) return false;                $("#info_tp_add").val(value); //确定保存后隐藏图片路径            });        });    </script>

 

效果图:

swfupload多图上传插件(ASP.NET)