• jquery.uploadify使用列子


    众所周知uploadify是一款非常不错的jquery上传插件,不仅可以一次性上传多个附件,同时也可以限制上传文件的格式,以免用户上传错误的文件格式。

    所以这款插件在我的系统中都有运用到。现在也分享给大家(第一次写博文,文采不好,请见谅!)

    不多说,上代码

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="jqUploadify_Default2" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>无标题页</title>
        <link href="scripts/uploadify.css" rel="stylesheet" type="text/css" />
        <link href="scripts/default.css" rel="stylesheet" type="text/css" />

        <script src="scripts/jquery-1.7.2.min.js" type="text/javascript"></script>

        <script src="scripts/swfobject.js" type="text/javascript"></script>

        <script src="scripts/jquery.uploadify.min.js" type="text/javascript"></script>

        <script type="text/javascript">
            $(function () {
                $("#file_upload").uploadify({
                    //开启调试
                    'debug': false,
                    //是否自动上传
                    'auto': false,
                    'buttonText': '选择照片',
                    //flash
                    'swf': "scripts/uploadify.swf",
                    //文件选择后的容器ID
                    'queueID': 'uploadfileQueue',
                    'uploader': '../Ajax/HandlerArtilceType.ashx',
                    'width': '75',
                    'height': '24',
                    'folder': 'tttt',
                    'multi': false,
                    'fileTypeDesc': '支持的格式:',
                    'fileTypeExts': '*.jpg;*.jpge;*.gif;*.png',
                    'fileSizeLimit': '1MB',
                    'removeTimeout': 1,

                    //返回一个错误,选择文件的时候触发
                    'onSelectError': function (file, errorCode, errorMsg) {
                        switch (errorCode) {
                            case -100:
                                alert("上传的文件数量已经超出系统限制的" + $('#file_upload').uploadify('settings', 'queueSizeLimit') + "个文件!");
                                break;
                            case -110:
                                alert("文件 [" + file.name + "] 大小超出系统限制的" + $('#file_upload').uploadify('settings', 'fileSizeLimit') + "大小!");
                                break;
                            case -120:
                                alert("文件 [" + file.name + "] 大小异常!");
                                break;
                            case -130:
                                alert("文件 [" + file.name + "] 类型不正确!");
                                break;
                        }
                    },
                    //检测FLASH失败调用
                    'onFallback': function () {
                        alert("您未安装FLASH控件,无法上传图片!请安装FLASH控件后再试。");
                    },
                    //上传到服务器,服务器返回相应信息到data里
                    'onUploadSuccess': function (file, data, response) {
                        //alert(data);
                    }
                });
            });

            function doUplaod() {
                $('#file_upload').uploadify('upload', '*');
            }

            function closeLoad() {
                $('#file_upload').uploadify('cancel', '*');
            }


        </script>

    </head>
    <body>
        <table width="704" border="0" align="center" cellpadding="0" cellspacing="0" id="__01">
            <tr>
                <td align="center" valign="middle">
                    <div id="uploadfileQueue" style="padding: 3px;">
                    </div>
                   
                </td>
            </tr>
            <tr>
                <td height="50" align="center" valign="middle" style=" margin-top:10px">
                     <div id="file_upload">
                    </div>
                    <img alt="" src="images/BeginUpload.gif" width="77" height="23" onclick="doUplaod()" style="cursor: hand" />
                    <img alt="" src="images/CancelUpload.gif" width="77" height="23" onclick="closeLoad()" style="cursor: hand" />
                </td>
            </tr>
        </table>
    </body>
    </html>

     后台HandlerArtilceType.ashx处理图片

     Ky.FileHandle.Writelog wr = new Ky.FileHandle.Writelog();
            try
            {
                context.Response.ContentType = "text/plain";
                context.Response.Charset = "utf-8";
                HttpPostedFile file = context.Request.Files["Filedata"];    //获取post过来的图片信息
                if (file != null)
                {
                    string address = "../HomeWork/Teacher/";
                    Ky.FileHandle.Files files = new Ky.FileHandle.Files();
                    List<string> str = new List<string>();
                    str = files.CreateNewFile(address);
                    String fileName = file.FileName;
                    String fileExt = Path.GetExtension(fileName).ToLower();
                    String newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
                    String filePath = str[0] + newFileName;
                    file.SaveAs(filePath);
                    //获取文件相对路径
                    string relativeBpicPath = "HomeWork/Teacher/" + str[1] + "/" + newFileName;
                    context.Session[SessionKey.SESSION_TeaMag_ADDNEWLAbFILE] = relativeBpicPath;
                    // 下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失
                    context.Response.Clear();
                    context.Response.Write("1");
                }
                else
                {
                    context.Response.Write("0");
                }
            }
            catch (Exception e)
            {
                wr.WriteLog(e, "Save图片信息至文件夹教师");
                context.Response.Write(e.Message);
            }

  • 相关阅读:
    nyoj--325--zb的生日(简单dp)
    nyoj--124--中位数(水题)
    nyoj--90--整数划分(母函数)
    nyoj--18--The Triangle(dp水题)
    CodeForces ---596B--Wilbur and Array(贪心模拟)
    nyoj--1023--还是回文(动态规划)
    poj--3984--迷宫问题(bfs+路径记录)
    Netty(4)Stream by codec(粘包与拆包)
    Netty(1-1)Discard
    Netty:option和childOption参数设置说明
  • 原文地址:https://www.cnblogs.com/roy1992/p/4310711.html
Copyright © 2020-2023  润新知