• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Asp.net 2.0 无刷新图片上传 显示缩略图 具体实现

    兼容性想还不错:FF,CH,IE,猎豹,都是可以实现的。如果看到回显。当然就是成功了。

    经历了好几天的不停的钻牛角尖,终于将这个二货弄出来了。真是煞费苦心啊。但是做出来的瞬间还是蛮开心的。

    第一步:我们需要加载几个JS库。
    jquery库。
    jquery.form.js库。

    下载这两个库,并引用到页面中。

    以下为页面中 JS 代码:

    复制代码 代码如下:

      function upload() {
                var options = {
                    type: "POST",                            //当然这个是传送方式
                    url: '../Include/Files.ashx',        //一般处理程序的路径
                    success: function (msg) {        //返回的参数
                        $("#server_img").attr("src", msg);            //回显图片。
                    }
                };
                // 将options传给ajaxForm
                $('#aspnetForm').ajaxSubmit(options);
     }

    第二步:一般处理程序内的代码
    复制代码 代码如下:

     public void ProcessRequest(HttpContext context)
        {
            HttpFileCollection files = context.Request.Files;              // From中获取文件对象
            if (files.Count > 0)
            {
                 string path = "";                                                            //路径字符串
                Random rnd = new Random();
                for (int i = 0; i files.Count; i++)
                {
                    HttpPostedFile file = files[i];                                        //得到文件对象
                    if (file.ContentLength > 0)
                    {
                        string fileName = file.FileName;
                        string extension = Path.GetExtension(fileName);
                        int num = rnd.Next(5000, 10000);                            //文件名称
                        path = "../../UserFiles/temp/" + num.ToString() + extension;
                        file.SaveAs(System.Web.HttpContext.Current.Server.MapPath(path));        //保存文件。
                    }
                }
                context.Response.Write(path);            //返回文件存储后的路径,用于回显。
            }
        }

    第三步:html或者aspx中的代码。
        以下两句代码随便插入html或者aspx中的任意位置。想来都是可以实现的。
    复制代码 代码如下:

        img id="server_img" width="360px" style="border: 1px solid #ccc; padding: 2px;"   title="" alt="" />   //用于回显图片
        asp:FileUpload ID="Up_load" runat="server" onchange="upload()"  ontextchange="upload()"/>        //上传图片,自动的,两个事件是为了保证所有浏览器都兼容。

    您可能感兴趣的文章:
    • asp.net中MVC借助Iframe实现无刷新上传文件实例
    • asp.net使用AJAX实现无刷新分页
    • asp.net中Timer无刷新定时器的实现方法
    • asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码
    • Asp.Net 无刷新文件上传并显示进度条的实现方法及思路
    • asp.net+jquery ajax无刷新登录的实现方法
    • asp.net jquery无刷新分页插件(jquery.pagination.js)
    • asp.net Ajax之无刷新评论介绍
    • asp.net点击 查看更多 实现无刷新加载的实现代码
    • asp.net 简便无刷新文件上传系统
    • asp.net ajax实现无刷新验证码
    • asp.net 30分钟掌握无刷新 Repeater
    • asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
    • Asp.net实现无刷新调用后台实体类数据并以Json格式返回
    上一篇:c#.net 动态读取 走马灯代码实例分享
    下一篇:asp.net中的“按需打印”(打印你需要打印的部分) 实现代码
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯

    时间:9:00-21:00 (节假日不休)

    地址:江苏信息产业基地11号楼四层

    《增值电信业务经营许可证》 苏B2-20120278

    Asp.net 2.0 无刷新图片上传 显示缩略图 具体实现 Asp.net,2.0,无,刷新,图片,