之前做的实例本地都可以,上传到服务器,默认的路径都是服务器的路径,这肯定不行,下面为正确之异地上传
前台:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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 runat="server">
<title>无标题页</title>
<script src="jquery1.4.2.js" type="text/javascript"></script>
<script src="ajaxfileupload.js" type="text/javascript"></script>
<script type="text/javascript">
function ajaxFileUpload() {
$.ajaxFileUpload
(
{
url: 'UploadImageHandler.ashx?userid=1&name=abc',
secureuri: false,
fileElementId: 'fileToUpload',
dataType: 'html',
beforeSend: function() {
$("#loading").show();
},
complete: function() {
$("#loading").hide();
},
success: function(data, status) {
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
alert(data.error);
} else {
alert(data.msg);
}
}
},
error: function(data, status, e) {
alert(e);
}
}
)
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="fileToUpload" type="file" size="45" name="fileToUpload" class="input">
<button class="button" id="buttonUpload" onclick="return ajaxFileUpload();"> Upload</button>
</form>
</body>
</html>
ashx文件
<%@ WebHandler Language="C#" Class="UploadImageHandler" %>
using System;
using System.Web;
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;
using System.Text;
public class UploadImageHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
//获取前台的FILE
HttpPostedFile file = context.Request.Files["fileToUpload"];
string path = "UploadImgs\\";
//Bitmap map = new Bitmap(filePath);
string fileName = Path.GetFileName(file.FileName);
string mapPath = context.Server.MapPath("~");
string savePath = mapPath + "\\" + path + fileName;
//map.Save(savePath);
file.SaveAs(savePath);
//上传成功后显示IMG文件
StringBuilder sb = new StringBuilder();
sb.Append("<img id=\"imgUpload\" src=\""+path.Replace("\\","/")+fileName+"\" />");
context.Response.Write(sb.ToString());
context.Response.End();
}
public bool IsReusable {
get {
return false;
}
}
}
- 本文标题: Jquery 之异步上传图片
- 文章分类:【JQuery/JavaScript】
- 非特殊说明,本文版权归【胡同里的砖头】个人博客 所有,转载请注明出处.