我们在使用上传控件的时候,会遇到刷新的问题,最近使用ajax做的上传,觉得效果还是很不错。

首先,我们需要在页面上放上上传控件;需要注意的是,我们必须放在form里面,实现表单上传。

 <form class="picForm" name="uploadPic" enctype="multipart/form-data">
        选择图片:<input type="file" class="file" name="picture" /><br />
 </form>

前台提交方法

function TajaxFileUpload() {
var mypath = "../ajax/upload.ashx?fileName="+需要的参数;
$("form[name='uploadPic']").ajaxSubmit({
url: mypath,
type: 'POST',
success: function (html, status) {
if (status == "success") {
html = html.replace(/<\/?[^>]*>/g, '');
//html = html.replace(/[ | ]*\n/g, '\n');
var json = eval('(' + html + ')');
if (json.state == "success") {
//上传成功
}
else {//上传失败
}
}
else {
art.dialog.alert("请求数据失败");
} //stauts success
} //submit success
}); //ajaxSubmit } //t ajax

upload.ashx代码如下

using System;
using System.IO;
using System.Web;
using System.Text;
using System.Net; namespace BatchImageUpload
{
/// <summary>
/// Summary description for upload
/// </summary>
public class upload : IHttpHandler
{ public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
try
{
if (context.Request.Files["picture"] == null)
{
//图片控件中没有选择图片
context.Response.Write("{state:'error',msg:'您还未选择图片'}");
}
else
{ string fileName = context.Request.QueryString["fileName"];
HttpPostedFile pic = context.Request.Files["picture"];
string foldPath = HttpContext.Current.Server.MapPath("/") + @"OrderUserInfoImages\";
foldPath = foldPath + fileName;
DirectoryInfo di = new DirectoryInfo(foldPath);
if (!di.Exists)//如果文件夹目录不存在
{
di.Create();//新建文件夹
}
string imageName = UpLoadImage(pic, foldPath);
context.Response.Write("{state:'success',msg:'上传成功:" + imageName + "'}"); }
}
catch (Exception ex)
{
context.Response.Write("{state:'error',msg:'" + ex.Message + "'}");
}
} #region 上传图片
/// <summary>
/// 上传图片
/// </summary>
/// <param name="imgfile">文件http流</param>
/// <param name="nowpath">所需放置的文件路径</param>
/// <returns>上传成功,返回字符串,否则,抛出异常</returns>
public static string UpLoadImage(HttpPostedFile imgfile, string nowpath)
{
try
{
string serverPath = System.Web.HttpContext.Current.Server.MapPath("~"); string toFilePath = Path.Combine(serverPath, nowpath); //获取要保存的文件信息
FileInfo file = new FileInfo(imgfile.FileName);
//获得文件扩展名
string fileNameExt = file.Extension; //验证合法的文件
if (CheckImageExt(fileNameExt))
{
//生成将要保存的随机文件名
string fileName = GetImageName() + fileNameExt; //获得要保存的文件路径
string serverFileName = toFilePath + fileName;
//物理完整路径
string toFileFullPath = serverFileName; //HttpContext.Current.Server.MapPath(toFilePath); //将要保存的完整文件名
string toFile = toFileFullPath;//+ fileName; ///创建WebClient实例
WebClient myWebClient = new WebClient();
//设定windows网络安全认证 方法1
myWebClient.Credentials = CredentialCache.DefaultCredentials;
////设定windows网络安全认证 方法2
imgfile.SaveAs(toFile); string relativePath =fileName;
return relativePath;
}
else
{
throw new Exception("文件格式非法,请上传gif|jpg|bmp|png格式的文件。");
}
}
catch
{
throw;
}
}
#endregion #region 图片上传格式和文件名
/// <summary>
/// 检查是否为合法的上传图片
/// </summary>
/// <param name="_fileExt"></param>
/// <returns></returns>
public static bool CheckImageExt(string _ImageExt)
{
string[] allowExt = new string[] { ".gif", ".jpg", ".jpeg", ".bmp", ".png" };
for (int i = 0; i < allowExt.Length; i++)
{
if (string.Compare(allowExt[i], _ImageExt, true) == 0)
{ return true; }
}
return false; } private static string GetImageName()
{
Random rd = new Random();
StringBuilder serial = new StringBuilder();
serial.Append(DateTime.Now.ToString("yyyyMMddHHmmssff"));
serial.Append(rd.Next(0, 999999).ToString());
return serial.ToString(); } #endregion public bool IsReusable
{
get
{
return false;
}
}
}
}

单文件上传只需要按照这个方法就可以。如果要做到批量上传,需要动态添加上传控件,然后遍历上传控件坐上传功能即可

ajax无刷新上传的更多相关文章

  1. 移动端图片上传解决方案localResizeIMG先压缩后ajax无刷新上传

    现在科技太发达,移动设备像素越来越高,随便一张照片2M+,但是要做移动端图片上传和pc上略有不同,移动端你不能去限制图片大小,让用户先处理图片再上传,这样不现实.所以理解的解决方案就是在上传先进行图片 ...

  2. ajaxfileupload.js插件结合一般处理文件实现Ajax无刷新上传

    先上几张图更直观展示一下要实现的功能.本功能主要通过Jquery ajaxfileupload.js插件结合ajaxUpFile.ashx一般应用程序处理文件实现Ajax无刷新上传功能,结合NPOI2 ...

  3. ajax无刷新上传和下载

    关于ajax无刷新上传和下载 这是一个没什么含量但是又用的比较多又不得不说的问题,其实真的不想说,因为没什么好说的. 关于上传 1.使用Flash,ActiveX 上传 ,略... 2.自己写XMLH ...

  4. ajax 无刷新上传

    最近要做微信的图文上传,因为一个图文了表中可以有多个图文,所有按钮需要随时添加,所以做了一种无刷新上传的方法. 首先我们要在html页面中写上这样的几段代码 javascript: $(functio ...

  5. Ajax 无刷新上传文件插件 uploadify 的使用

    在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...

  6. ajax无刷新上传文件

    网页上传文件最简单的方式就是通过表单上传了,但是在提交表单的时候会导致网页刷新,但有的时候我们不想网页刷新,有什么办法呢,我们可以使用ajax上传文件来做到这一点.只有ajax还不行,还需要JavaS ...

  7. jquery 的ajax无刷新上传文件之后,页面还是会莫名的刷新-----解决办法

    文件上传用到全局数组: $_FILES 只需要把下面的 <button onclick="post()">提交</button> 改为 <input ...

  8. jQuery.form Ajax无刷新上传错误 (jQuery.handleError is not a function) 解决方案

    今天,随着ajaxfileupload时间firebug财报显示,"jQuery.handleError is not a function"错误.因为一旦使用jQuery.for ...

  9. jquery ajax 无刷新上传

    var form = new FormData(); form.append('file', $("#submitmaterials").find("input" ...

随机推荐

  1. MTT学习小记

    这是个毒瘤题才有的毒瘤东西--奶一口NOI不考 拆系数FFT: 考虑做NTT时模数不是NTT模数(\(2^a*b+1\))怎么办? 很容易想到拆次数FFT. 比如说现在求\(a*b\),设\(m=\s ...

  2. cdq分治·三维偏序问题

    转载自FlashHu大佬的博客CDQ分治总结(CDQ,树状数组,归并排序),在讲述部分有部分删改,用了自己的代码 CDQ分治的思想 CDQ分治是基于时间的离线分治算法.这一类分治有一个重要的思想——用 ...

  3. NX二次开发-UFUN获取工程图所有视图tag UF_DRAW_ask_views

    #include <uf.h> #include <uf_draw.h> #include <uf_drf.h> #include <uf_obj.h> ...

  4. NX二次开发-UFUN获取当前导出CGM选项设置UF_CGM_ask_session_export_options

    文章转载自唐康林NX二次开发论坛,原文出处: http://www.nxopen.cn/thread-126-1-1.html 刚才有同学问到这个问题,如果是用NXOpen来做,直接录制一下就可以了: ...

  5. KiFastCallEntry() 机制分析

    1. 概述 从 windows xp 和 windows 2003 开始使用了快速切入内核的方式提供系统服务例程的调用. KiFastCallEntry() 的实现是直接使用汇编语言,C 语言不能直接 ...

  6. LeetCode 182. Duplicate Emails (查找重复的电子邮箱)

    题目标签: 题目给了我们一个 email 的table,让我们找到重复的 email. 可以建立 Person a, Person b, 找到两个表格中,emai 相等 但是 id 不同的 email ...

  7. Golang 交叉编译跨平台的可执行程序 (Mac、Linux、Windows )

    起因: 在项目中,我们每一次提交都需要添加commit 信息,而且我们的commit 信息,比较繁琐.我决定用golang语言编写一个小工具. 我决定使用语言:golang,使用工具:gox包. go ...

  8. Vue.js中的图片引用路径问题

    当我们在Vue.js项目中引用图片时,关于图片路径有以下几种情形: 使用一: 在data里面定义好图片路径: /*错误写法*/ imgUrl:'../assets/logo.png' 在templat ...

  9. 高手总结CSS书写技巧

    这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果.这个针对不同的浏览器写不同的CSS code的过程,就叫CSS hack ...

  10. 2.用Python套用Excel模板,一键完成原亮样式

    from xlutils.copy import copy import xlrd import xlwt tem_excel=xlrd.open_workbook('日统计.xls',formatt ...