asp.net mvc3 上传图片

    在mvc3 中上传图片，可以借助 ajax upload 插件，实现无刷新上传，具体实现如下：

   

    首先在页面中引用ajaxupload.js

  

    然后js方法：

   

   

 

var vAlertMsg = '图片格式不正确,请选择 jpg|jpeg|gif|png 格式的文件!';

 

function createUploader() {
    var upload1 = new AjaxUpload('#btnUpfile', {
        action: '/Handler/uploadPic.ashx', //后台实现上传功能
        responseType: 'json',
        autoSubmit: true,
        onSubmit: function (file, ext) {
            if (!(ext && /^(jpg|jpeg|gif|png)$/ig.test(ext))) {
                alert(vAlertMsg, '系统提示');
                return false;
            }
            $('#uploading').html('<img src="http://images.cnblogs.com/ajax-loader.gif" />文件上传中,请稍后！');
        },
        onComplete: function (file, json) {
            var err = json['Msg'];
            var file1;
            if (err != null && err != '') {
                alert(err);
            }
            else {
                file1 = json['FilePath'];

                $('input[id$="txtWorksImage'"]').val(file1);
               
                $('#uploading').html('<span>*</span>上传图片成功');                

                $('input[id$="Pic"]').val(file1);

            }
        }
    });
}

 

 

 

   在页面中初始化js方法

  

$(function () {
        createUploader();})

 

   再在页面中加入如下html

  

 

 @Html.Hidden("txtWorksImage")
 @Html.TextBoxFor(model => model.Pic)
 <input type="button" style="width:54px; height:24px; border:0px; background-image:url(/images/img_36.gif);" id="btnUpfile" />
 @Html.ValidationMessageFor(model => model.Pic, "", new { @id = "uploading" })

 

   

   注意ID，要与js方法中的一致哦~