C#图片上传效果实例分析

本文实例讲述了C#图片上传效果实现方法。分享给大家供大家参考。具体如下:

<%@ Page Title="" Language="C#" MasterPageFile="~/Default.master" AutoEventWireup="true"
 CodeFile="Default.aspx.cs" Inherits="Default" %>
<asp:Content ID="cHead" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="cBody" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<asp:Literal runat="server" ID="ltrHTML"></asp:Literal>
<script type="text/javascript">
    $().ready(function () {
       var counter = 0;
       $(function () {
         var btnUpload = $('#addImage');
         new AjaxUpload(btnUpload, {
          action: 'saveupload.aspx',
          name: 'uploadfile',
           onSubmit: function (file, ext) {
             $("#loading").show();
           },
           onComplete: function (file, response) {
             var uploadedfile = "UserData/" + file;
             $("#uploadImageWrapper").append("<div class='imageContainer offset' id='current" + counter + "'><img height='65px' width='65px' src='" + uploadedfile + "' alt='" + uploadedfile + "'/><div id='close" + counter + "' class='close' title='" + uploadedfile + "' onclick='RemoveImage(this);'><a ></a></div></div>");
             $('#current' + counter).fadeIn('slow', function () {
              $("#loading").hide();
               $("#message").show();
               $("#message").html("Added successfully!");
               $("#message").fadeOut(3000);
               counter++;
             });
           }
         });
       });
    });
     function RemoveImage(_this) {
       var counter = _this.id.replace('close', '');
       $("#loading").show();
       $.ajax({
         type: "POST",
         url: "removeupload.aspx",
         data: "filename=" + _this.getAttribute('title'),
         success: function (msg) {
           $('#current' + counter).fadeOut('slow', function () {
             $("#loading").hide();
             $("#message").show();
             $("#message").html("Removed successfully!");
             $("#message").fadeOut(3000);
           });
         }
       });
     }
   </script>
   <table id="imageUploader" cellpadding="0" cellspacing="0">
     <tr class="header">
       <td style="padding-left: 5px;">
         <a id="addImage" href="javascript:;">Add Image</a>
       </td>
     </tr>
     <tr class="body">
       <td valign="top">
         <div id="uploadImageWrapper">
         </div>
       </td>
     </tr>
     <tr class="footer">
       <td>
         <div id="loading" style="display: none">
           <table cellpadding="0" cellspacing="0">
             <tr>
               <td>
                 <img width="20" height="20" src="Images/Loading.gif" alt="Loading..." />
               </td>
               <td>
                Please wait...
               </td>
             </tr>
           </table>
         </div>
         <div id="message" style="color: Green">
         </div>
       </td>
     </tr>
   </table>
 </asp:Content>

希望本文所述对大家的C#程序设计有所帮助。

时间: 2015-06-15

ASP.NET(C#)实现一次性动态上传多张图片的代码(多个文件)

在做asp.net的Web开发的时候,我们经常会遇到一次性上传多个文件的需求.通常我们的解决方法是固定放多个上传文件框,这样的解决办法显然是不合理的,因为一次上传多个,就意味着数量不确定.因此我们就要让这些文件上传框动态添加,下面我以我做的一个图库管理中的上传图片的功能为例 先看效果: 打开的初始界面: 默认是上传一个图片,但当我们点"增加图片"按钮时可以实现选择多个图片及其描述同时上传,本功能限制一次最多只能上传8张,且每张图片大小不超过1M,这个大家可根据实际情况更改! 如图: 下

c#图片上传和显示的实现方法

由于需要图片上传的功能,所以花了一些时间网上找相关资料终于搞定,效果图如下: 下面的是解决方案截图和上传的图片截图: 具体实现代码如下: 1.界面代码 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadPic.aspx.cs" Inherits="Pic_Try.UploadPic" %> <!DOCTYPE html PUBLIC

C#实现图片上传与浏览切换的方法

本文以一个完整实例讲述了C#实现图片上传与浏览切换的方法,对于进行C#程序设计来说具有一定的借鉴价值.分享给大家供大家参考. 具体实现代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %> <!DOCTYPE html PUBLIC "-//W3C//

C#实现图片上传(PC端和APP)保存及 跨域上传说明

A-PC端: 1-页面--multiple是控制单张还是多张图片上传 <input id="BusRoute" type="file" class="btn btn-default btn-lg" style="height:34px;padding-top:5px;padding-bottom:5px;" multiple /> 2-后台获取图片文件: HttpFileCollection pcFileColl

C#判断上传文件是否是图片以防止木马上传的方法

很多时候木马程序会伪装成其他格式的文件上传到网站,最常见的如图片格式.本文就以C#为例讲述C#判断上传文件是否是图片以防止木马上传的方法,具体方法如下: 方法一:用image对象判断是否为图片 /// <summary> /// 判断文件是否为图片 /// </summary> /// <param name="path">文件的完整路径</param> /// <returns>返回结果</returns> pu

基于C# winform实现图片上传功能的方法

本文所述实例实现将一张图片上传到指定的文件夹,然后在窗体上的PictrueBox控件中显示出来. 具体功能代码如下: private void btnUpload_Click(object sender, EventArgs e) { //创建一个对话框对象 OpenFileDialog ofd = new OpenFileDialog(); //为对话框设置标题 ofd.Title = "请选择上传的图片"; //设置筛选的图片格式 ofd.Filter = "图片格式|*

C# 最齐全的上传图片方法

方法里包括了图片大小限制.图片尺寸.文件内容等等的判断... 该案例是mvc下的demo,支持单张图片上传. public ActionResult Upload() { string imgurl = ""; foreach (string key in Request.Files) { //这里只测试上传第一张图片file[0] HttpPostedFileBase file0 = Request.Files[key]; //转换成byte,读取图片MIME类型 Stream st

c#多图片上传并生成缩略图的实例代码

前台代码: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="upload.aspx.cs" Inherits="upload" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&q

c#批量上传图片到服务器示例分享

客户端代码: 复制代码 代码如下: /// <summary>/// 批量上传图片/// </summary>/// <param name="srcurl">服务器路径</param>/// <param name="imagesPath">图片文件夹路径</param>/// <param name="files">图片名称</param>publ

C#使用Socket上传并保存图片的方法

本文实例讲述了C#使用Socket上传并保存图片的方法.分享给大家供大家参考.具分析如下: 使用string filename = openFile.FileName;即返回带全路径的文件名 Path.GetFileNameWithoutExtension(filename)即可获得不带路径.后缀名的文件名. 上传图片使用二进制 tcp协议上传的 客户端代码: using System; using System.Collections.Generic; using System.Compone

C#保存上传来的图片示例代码

复制代码 代码如下: [HttpPost] public string UploadImage() { //string ss = Request.Form["uploadFile"]; //return ss; HttpPostedFileBase uploadFile = Request.Files[0]; string fileName = uploadFile.FileName; int fileSize = uploadFile.ContentLength; string f

JavaScript使用Ajax上传文件的示例代码

本文介绍了JavaScript使用Ajax上传文件的示例代码,分享给大家,具体如下: 实现文件的上传主要有两种方式: 使用form表单提交上传 html代码如下: <form id="uploadForm" enctype="multipart/form-data"> <input id="file" type="file" name="file"/> <button id=&

无刷新预览所选择的图片示例代码

代码如下 复制代码 代码如下: <!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> <meta http-equi

ReactNative实现图片上传功能的示例代码

最近在学习ReactNative,ReactNative可以基于目前大热的开源JavaScript库React.js来开发iOS和Android原生App,今天就学习一下ReactNative实现图片上传功能 在查看ReactNative的官方文档的时候,你会发现其实Fackbook是没有提供图片上传功能的. 如果我们的项目里需要使用图片上传(用js 实现图片上传),那我们有没有什么办法呢? 通过搜索React-native的github, 会发现里面有这么一篇文章:https://github

ie8本地图片上传预览示例代码

复制代码 代码如下: imgpath= getRealPath(fileId): document.getElementById("divSBTP").style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\""+ imgpath + "\")";//使用滤镜效果 func

web前端开发upload上传头像js示例代码

这次分享一个简易的上传头像示例,其大致流程为: 一.将选择的图片转为base64字符串 function preview(file) {//预览图片得到图片base64 var prevDiv = document.getElementById('preview'); if (file.files && file.files[0]) { var reader = new FileReader(); reader.onload = function(evt){ prevDiv.innerHT

PHP实现上传多文件示例代码

上传多文件 1.在对多文件信息进行操作前,需要构建文件信息,通过buildInfo函数将三维数组转换成便于文件操作的二维数组. function buildInfo(){ $i = 0; foreach ($_FILES as $v){ //判断是否是单文件 if(is_string($v['name'])){ $files[$i] = $v; $i++; }else{ //多文件 foreach ($v['name'] as $key => $value){ $files[$i]['name'

js实现幻灯片播放图片示例代码

1,在页面添加下面的元素.展示出置出图片文件列表文件. 复制代码 代码如下: <select id="img_date" style="width: 100%; margin-top: 10px; height: 50%;" size="20"> <option value="图片的url">图片名字</option> </select> 2,播放文件列表的方法.主要是遍历文件列

vuejs+element-ui+laravel5.4上传文件的示例代码

前言 之前的文章讲得太多安装了,今天就不说这个了,因为我的项目是前后端分离的,所以基本是分开执行代码逻辑.其中还有跨域问题,主要还是在laravel中添加头信息放行之类的,这里会提一下做法. element-ui的upload组件 我的vue代码: <template> <el-upload :action="uploadAction" list-type="picture-card" :on-remove="handleRemove&q

在Android上实现HttpServer的示例代码

在最近的项目中因为要用Android作为一个服务器去做一个实时接收数据的功能,所以这个时候就要去做一个Android本地的微型服务器. 那么此时我首先想到了spring boot,因为他是一个服务器的框架.但是实际上我们根本用不到这么大型的服务器框架,配置这些都太麻烦.所以,我又找到了Ijetty.NanoHttpd和AndroidAsync这三个框架,都是比较微型的,适用于Android的. 经过对比,Ijetty使用起来过于复杂,而且会莫名其妙的报一些不太容易解决的问题,所以,舍弃掉了. 因