ASHX是一種服務器處理請求的技術,而jQuery則是一種流行的JavaScript庫。通過這兩種技術的結合,我們可以實現圖片上傳功能。
首先,我們創建一個ASHX文件,用于處理上傳請求:
public class UploadImage : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; context.Response.Expires = -1; try { HttpPostedFile file = context.Request.Files[0]; string savePath = context.Server.MapPath("~/images/") + file.FileName; file.SaveAs(savePath); context.Response.Write("success"); } catch (Exception ex) { context.Response.Write("error" + ex.Message); } } public bool IsReusable { get { return false; } } }
這段代碼會將上傳的圖片保存在服務器的images文件夾下,并返回上傳的結果。
然后,在前端頁面中,我們使用jQuery的ajax方法來發送上傳請求:
$('input[type=file]').change(function() { var file = this.files[0]; var formData = new FormData(); formData.append('file', file); $.ajax({ url: '/upload.ashx', type: 'post', data: formData, processData: false, contentType: false, success: function(response) { if(response == 'success') { alert('上傳成功!'); } else { alert('上傳失敗:' + response); } }, error: function() { alert('上傳失敗!'); } }); });
這段代碼會監聽文件選擇框的change事件,當選擇了文件后,將文件打包成FormData,通過ajax發送到服務器的ASHX文件處理。
綜上,ASHX和jQuery結合可以方便地實現圖片上傳功能。
上一篇抽獎css和js
下一篇mysql中字符串的位置