博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
asp.net 利用jquery.form插件上传图片
阅读量:5172 次
发布时间:2019-06-13

本文共 4221 字,大约阅读时间需要 14 分钟。

直接进入正题:

//**********asp.net 前台页*********************************************************************************************

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadImg.aspx.cs" Inherits="jq_form_plug.UploadImg" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>

/***********************引用一下三个js库*******************************/

<script src="Script/jquery-1.7.1.intellisense.js"></script>
<script src="Script/jquery-1.7.1.js"></script>
<script src="Script/jquery.form.js"></script>

/***********************此js包含上传方法*******************************************/

<script src="Script/uploadImg.js"></script>
<style>
.file{display:none}
</style>
</head>
<body>
<form id="form1" runat="server">
<img src="images/AB.png" id="showimg_1" width="66" height="66" />
<input type="file" id="file_1" name="file_1" class="file" />
<input type="button" value="上传图片" οnclick="uploadImg(1)" />
<p></p>
<img src="images/AB.png" id="showimg_2" width="66" height="66" />
<input type="file" id="file_2" name="file_2" class="file" />
<input type="button" value="上传图片" οnclick="uploadImg(2)" />
<p></p>
<img src="images/AB.png" id="showimg_3" width="66" height="66" />
<input type="file" id="file_3" name="file_3" class="file" />
<input type="button" value="上传图片" οnclick="uploadImg(3)"/>
</form>
</body>
</html>

//*****************js 上传****************************************/

/*

||=================================================================||
||注:格式要求: ||
|| 1:file元素id为file_1/file_2/file_3格式。 ||
|| 2:默认图片img元素id为showimg_1/showimg_2/showimg_3格式 ||
|| 3:*file元素必须指定name值为file_1/file_2/file_3格式 ||
|| 4:表单提交form元素id为form1 ||
|| *可以更改 ||
||=================================================================||
*/
function uploadImg(flag) {
$("#file_" + flag + "").click();//触发事件
$("#file_" + flag + "").change(function () {
if ($.trim($("#file_" + flag + "").val()) == "") {
return;
}
var arr = $.trim($("#file_" + flag + "").val()).split('.');//截取得到后缀
if (!/(?:jpg|png|gif)$/.test(arr[1])) {
alert("图片只能是jpg,gif,png");
return;
}
$("#form1").ajaxSubmit({
beforeSend: function () {
$("#showimg_" + flag + "").empty();//删除匹配的元素集合中所有的子节点。可以去掉
$("#showimg_" + flag + "").attr("src", '../images/temp.gif');
},
data: { flag: flag },//标识数据:表示具体第几个file元素
url: "../data/upload.ashx",
type: "post",
success: function (data) {
if (data != null) {
//IE显示图片会默认加上<PRE></PRE>,着必须要把去除掉才能在低版本ie显示
data = data.replace("<PRE>", "").replace("</PRE>", "");
$("#showimg_" + flag + "").attr("src", data);
}
else {
alert("上传失败!请联系技术客服!");
}
}
})
})
}

//*************************************一般程序集****************************************************

using System;

using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace jq_form_plug.data

{
/// <summary>
/// upload 的摘要说明
/// </summary>
public class upload : IHttpHandler
{

public void ProcessRequest(HttpContext context)

{
context.Response.ContentType = "text/plain";
int flag = int.Parse(context.Request.Form["flag"].ToString());
HttpPostedFile img = null;
if (flag == 1)
{
//获取上传的文件的对象
img = context.Request.Files["file_1"];
}
else if (flag == 2)
{
//获取上传的文件的对象
img = context.Request.Files["file_2"];
}
else if (flag == 3)
{
//获取上传的文件的对象
img = context.Request.Files["file_3"];
}
if (img != null && img.ToString().Length > 0)
{
string file = DateTime.Now.ToString("yyyyMMddHHmmssfff") + ".jpg";
string path = @"../upimg/" + file;
//string path = context.Request.PhysicalApplicationPath + @"upimg/";
//string originalImagePath = path + file;//原图片物理路径
//string sthumbnailPath = path + "/s_" + file;
//string mthumbnailPath = path + "/m_" + file;
try
{
img.SaveAs(context.Server.MapPath(path));//将原图进行保存
//Thumbnail.MakeThumbnail(originalImagePath, sthumbnailPath, 200, 200, "HW");
//Thumbnail.MakeThumbnail(originalImagePath, mthumbnailPath, 302, 270, "HW");
//string url = Jnwf.Utils.Config.ConfigurationUtil.GetAppSettingValue("picture").ToString();
context.Response.Write(path);
}
catch (Exception ex)
{
context.Response.Write("");
}
}
}

public bool IsReusable

{
get
{
return false;
}
}
}
}

 

转载于:https://www.cnblogs.com/zhengchengye/p/5363320.html

你可能感兴趣的文章
python的paramiko模块
查看>>
poj 1027 深搜
查看>>
读吴恩达算-EM算法笔记
查看>>
TDD---测试驱动开发(1)
查看>>
jQuery左侧图片右侧文字滑动切换代码
查看>>
spoj 138
查看>>
git branch 分支管理
查看>>
查看Wordpress数据表关系
查看>>
Vue2.0组件之间通信
查看>>
选择算法
查看>>
SVN提示: File or directory '*' is out of date; try updating 解决方案 .
查看>>
Flutter 移动端屏幕适配方案和制作
查看>>
[工具向]__申请,下载,使用百度地图api
查看>>
561. Array Partition I
查看>>
datagridview控件
查看>>
[搜片神器]服务器SQL2005查询分页语句你理解了么
查看>>
【BZOJ 4551】【TJOI2016】【HEOI2016】树
查看>>
易语言 word类excel类 的 源码和模块
查看>>
Mysql索引
查看>>
Extjs项目实战视频教程
查看>>