前台：

<div style="display:none" id="upimg"><table cellpadding="0" cellspacing="0" style="border-collapse:collapse; border:solid 1px #9bc4e9; width:360px">
        <tr>
            <td align='center' style='width:100px; border:solid 1px #9bc4e9'>图片：</td>
            <td style='border:solid 1px #9bc4e9; height:35px' align='center'>
            <input id='imgfile' type='file' />
            保存ID的<input id="Hidden1" type="hidden" />
            保存File控件值的<input id="Hidden2" type="hidden" />
            
            </td>
        </tr>
        <tr>
            <td align='center' style='width:100px; border:solid 1px #9bc4e9; height:35px'> </td>
            <td style='border:solid 1px #9bc4e9' align='center'><input id="Button1" type="button" value="上传" /></td>
        </tr>
    </div>

JS文件：

$(function(){
    $("#Button1").click(function(){
        var path = $("#Hidden1").val();
        if(path.length==0)
        {
            alert("请上传图片附件");
            return;
        }
        $.post("../ashx/Article.ashx",{id:$("#Hidden2").val(),file:path},function(data){
            if(parseInt(data)>0)
            {
                alert("上传成功");
                return;
            }
            else
            {
                alert("上传失败");
                return;
            }
        })
    })
    
    $("#imgfile").change(function(){
        $("#Hidden1").val($(this).val());
    })
})

ashx代码：

<%@ WebHandler Language="C#" Class="Article" %>

using System;
using System.Web;
using Web.Dal;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.IO;
using System.Net;

public class Article : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        string path = context.Request.Form["file"];
        int id = Convert.ToInt32(context.Request.Form["id"]);
        //FileUpload fu = new FileUpload();
        //fu.PostedFile.FileName = path;
        string savepath = string.Format("WebUI/File/NewsImg/{0}-{1}/", DateTime.Now.Year, DateTime.Now.Month);
        if (!Directory.Exists(context.Server.MapPath("~/" + savepath)))
            Directory.CreateDirectory(context.Server.MapPath("~/" + savepath));
        string sty = path.Substring(path.LastIndexOf('.'));
        savepath += DateTime.Now.Ticks.ToString() + sty;
        WebClient myWebClient = new WebClient();
        //设定window网络安全认证
        myWebClient.Credentials = CredentialCache.DefaultCredentials;

        //要上传的文件
        FileStream fs = new FileStream(path, FileMode.Open, FileAccess.Read);

        BinaryReader br = new BinaryReader(fs);
        //使用UploadFile方法可以用下面的格式
        myWebClient.UploadFile(savepath, path);

        context.Response.Write(new ArticleServer().EditImg(id, savepath));
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }

}

• 本文标题： JQuery上传图片实例
• 文章分类：【JQuery/JavaScript】
• 非特殊说明，本文版权归【胡同里的砖头】个人博客 所有，转载请注明出处.

• 上一篇：Jquery 之异步上传图片
• 下一篇： Jquery 之uploadPreview.js上传图片