轻量级伪ajax 文件上传。

最新推荐文章于 2024-09-21 09:29:16 发布

dingdingshinie1008

最新推荐文章于 2024-09-21 09:29:16 发布

阅读量72

点赞数

文章标签： javascript 前端 ViewUI

原文链接：http://www.cnblogs.com/caicainiao/archive/2011/07/20/2111380.html

版权

js文件：

document.writeln("<div id='answerupfilediv' style='text-align:right'></div>");
var upLoadDemo =

" <input type='hidden' value='' id='upFileName' name='upFileName' /> <form id='formFile' name='formFile' method=\"post\" action='http://www.cnblogs.com/upload.aspx' target='frameFile' enctype=\"multipart/form-data\"><input type='file' id='fileUp' οnchange='UpLoadFileChange();' name='fileUp' /></form><iframe id='frameFile' name='frameFile' style=' display:none;'></iframe><div style='display:none' id='uploadLog'></div><div id='UpLoadFileLinkDiv' style='display:none' ><a id='uploadfilehrefa' href = '../UpFile/' target='_blank'></a>    <a style='cursor: pointer;display:none;color:#018DCA' id='updateUpLoadFileLink' οnclick='updateUpLoadFile();'>update</a></div>"

$("#answerupfilediv").append(upLoadDemo);

        //$(function() {
        //    $('#fileUp').change(function() {
        //        $('#uploadLog').html('Loading....');
        //        $('#formFile').submit();
        //    });
        //})

//2011-07-23 修正，如果有登陆限制，链带onclick，则不能够使用事件委托

function UpLoadFileChange() {
    $('#UpLoadFileLinkDiv').css('display', 'none');
    $('#uploadLog').html('Loading....');
    $('#uploadLog').css('display', '');
    $('#formFile').submit();
}

//2011-07-25修正增加修改上传附件

function updateUpLoadFile() {
$('#formFile').css('display', '');
$('#answerUpLoadFileButton').removeAttr('disabled');
}

//2011-07-25修正增加登录限制

$("#fileUp").bind("click", function() {
    if (isValUserLogin == 0 && !ValUserLgoin($("#answerupfilediv"))) {
        showfadeDiv($("#lgdiv"), $("#answerupfilediv"));
        return false;
    }
})

//2011-07-22 修正，兼容火狐，ie。之前的版本只能在火狐中使用，

XXX.aspx：

<div>

</div>

upload.aspx.cs ：（必须滴）

protected void Page_Load(object sender, EventArgs e)
    {
        try
        {
            //获取当前Post过来的file集合对象,在这里我只获取了<input type='file' name='fileUp'/>的文件控件
            HttpPostedFile file = Request.Files["fileUp"];
            if (file != null)
            {
                //当前文件上传的目录
                string path = Server.MapPath("~/");
                //当前待上传的服务端路径
                string imageUrl = path + Path.GetFileName(file.FileName);
                //当前文件后缀名
                string ext = Path.GetExtension(file.FileName).ToLower();
                //验证文件类型是否正确
                if (!ext.Equals(".gif") && !ext.Equals(".jpg") && !ext.Equals(".png") && !ext.Equals(".bmp"))
                {
                    //这里window.parent.uploadSuccess()是我在前端页面中写好的javascript function,此方法主要用于输出异常和上传成功后的图片地址
                    Response.Write("<script>window.parent.uploadSuccess('你上传的文件格式不正确！上传格式有(.gif、.jpg、.png、.bmp)');</script>");
                }
                //验证文件的大小
                if (file.ContentLength > 1048576)
                {
                    //这里window.parent.uploadSuccess()是我在前端页面中写好的javascript function,此方法主要用于输出异常和上传成功后的图片地址
                    Response.Write("<script>window.parent.uploadSuccess('你上传的文件不能大于1048576KB!请重新上传！');</script>");
                }
                //开始上传
                file.SaveAs(imageUrl);

                //这里window.parent.uploadSuccess()是我在前端页面中写好的javascript function,此方法主要用于输出异常和上传成功后的图片地址
                //如果成功返回的数据是需要返回两个字符串，我在这里使用了|分隔例：成功信息|/Test/hello.jpg
                Response.Write("<script>window.parent.uploadSuccess('Upload Success!|/Test/" + file.FileName + "');</script>");
            }
            else
            {
                //上传失败
                Response.Write("upload lose!");
            }
        }
        catch
        {
            //上传失败
            Response.Write("upload lose!");
        }
    }

据说看了不回帖的人，经常玩 DeBug

转载于:https://www.cnblogs.com/caicainiao/archive/2011/07/20/2111380.html