脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → C#教程 → C#图片上传与浏览切换

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

 更新时间：2014年08月25日 11:09:09   投稿：shichen2014  
这篇文章主要介绍了C#实现图片上传与浏览切换的方法,是很有实用价值的一个应用技巧,需要的朋友可以参考下

本文以一个完整实例讲述了C#实现图片上传与浏览切换的方法，对于进行C#程序设计来说具有一定的借鉴价值。分享给大家供大家参考。

具体实现代码如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!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 runat="server">
  <title>无标题页</title>
  <script src="js/jquery-1.7.2.js" type="text/javascript"></script>
  <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $('.upic').change(function() {
        var filename = $(this).val().replace(/.*(\/|\\)/, ""); //文件名
        var fileExt = (/[.]/.exec(filename)) ? /[^.]+$/.exec(filename.toLowerCase()) : ''; //后缀名
        if (fileExt != "jpeg" && fileExt != "jpg" && fileExt != "gif" && fileExt != "png") {
          alert('请选择一个jpg或gif的图片文件');
          return;
        };
        $(this).parent().parent().parent().addClass('support');
        if ($.browser.msie) {
          if ($.browser.version == "6.0") {
            $(this).parent().parent().siblings(".preview").html('<img style="height:auto;width:88px;" src="' + $(this).val() + '"/>');
          } else {
            var previewDiv = $(this).parent().parent().siblings(".preview");
            previewDiv.css({ filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image)" });
            previewDiv[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").sizingMethod = "scale";
            try {
              previewDiv[0].filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = getPath($(this)[0]);
            }
            catch (e) {
              alert(e.name + ": " + e.message);
              alert("无效的图片文件！");
              return;
            }
          }
        }
        else {
          //var data=$(this)[0].files.item(0).getAsDataURL();
          var data = window.URL.createObjectURL($(this)[0].files[0]);
          $(this).parent().parent().siblings(".preview").html('<img style="height:auto;width:88px;" src="' + data + '"/>');
          return;
        }
        $(this).parent().parent().parent().mouseover(function() { $(this).addClass('hover'); }).mouseout(function() { $(this).removeClass('hover'); });
      });
      $('.del').click(function() {
        $(this).parent().siblings("[name='isDel']").val("1");
        var file = $(this).parent().siblings(".upload").children().children(".upic");
        file.after(file.clone(true).val("")).remove();
        $(this).parent().siblings(".preview").after('<div class="preview"></div>').remove();
        //$(this).parent().siblings(".preview").empty();
        $(this).parent().parent().removeClass('support').mouseout().unbind('mouseover');
      });
      if ($.browser.msie) {
        $('#memberPhoto').filter('.support').mouseover(function() { $(this).addClass('hover'); }).mouseout(function() { $(this).removeClass('hover'); });
      };
      //获得上传控件的值，obj为上传控件对象
      function getPath(obj) {
        if (obj) {
          if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
            obj.select();
            document.getElementById("btnSave").focus(); //hack for IE9下，如果file控件获得焦点，则document.selection.createRange()拒绝访问
            return document.selection.createRange().text;
          }
          else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
            if (obj.files) {
              return obj.files.item(0).getAsDataURL();
            }
            return obj.value;
          }
          return obj.value;
        }
      }
    });
  </script>
</head>
<body>
  <form id="form1" runat="server">
  <div id="pic">
    <div id="memberPhoto" style="position: relative">
      <%if (!string.IsNullOrEmpty(imagePath))
       {%>
      <div class="preview">
        <img src="../<%=imagePath%>" style="height: auto; width: 88px;" /></div>
      <%}
       else
       {%>
      <div class="preview">
      </div>
      <%}%>
      <div class="upload">
        <a class="a-sc" href="javascript:;">
          <input id="imageUpload" class="upic" type="file" name="upic" runat="server" />
        </a>
      </div>
      <div class="act">
        <span class="del">删除</span>
      </div>
    </div>
  </div>
  </form>
</body>
</html>


public partial class Default3 : System.Web.UI.Page
{
  public string imagePath = "";
  protected void Page_Load(object sender, EventArgs e)
  {

  }
}

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

您可能感兴趣的文章:

相关文章

  • c# 判断是否为空然后赋值的4种实现方法

    c# 判断是否为空然后赋值的4种实现方法

    下面小编就为大家分享一篇c# 判断是否为空然后赋值的4种实现方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • 算法证明每一位都相同十进制数不是完全平方数

    算法证明每一位都相同十进制数不是完全平方数

    这篇文章主要为大家介绍了算法证明每一位都相同十进制数不是完全平方数的过程论述，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2022-05-05
  • C#中的并发集合Concurrent类

    C#中的并发集合Concurrent类

    这篇文章介绍了C#中的并发集合Concurrent类，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2022-05-05
  • Unity2D实现游戏回旋镖

    Unity2D实现游戏回旋镖

    这篇文章主要为大家详细介绍了Unity2D实现游戏回旋镖，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2021-09-09
  • Unity3D基于OnGUI实时显示FPS

    Unity3D基于OnGUI实时显示FPS

    这篇文章主要介绍了Unity3D基于OnGUI实时显示FPS，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2019-11-11
  • DataGridView控件常用属性介绍

    DataGridView控件常用属性介绍

    这篇文章介绍了DataGridView控件的常用属性，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2022-02-02
  • C#通过html调用WinForm的方法

    C#通过html调用WinForm的方法

    这篇文章主要介绍了C#通过html调用WinForm的方法,涉及html页面中使用JavaScript访问C#的相关技巧,需要的朋友可以参考下
    2016-04-04
  • C#中的属性解析(get、set、value)

    C#中的属性解析(get、set、value)

    这篇文章主要介绍了C#中的属性(get、set、value)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
    2022-08-08
  • C#实现DataTable转换成IList的方法

    C#实现DataTable转换成IList的方法

    这篇文章主要介绍了C#实现DataTable转换成IList的方法,涉及C#针对DataTable操作的相关技巧,需要的朋友可以参考下
    2016-03-03
  • C#定制Excel界面并实现与数据库交互的方法

    C#定制Excel界面并实现与数据库交互的方法

    这篇文章主要介绍了C#定制Excel界面并实现与数据库交互的方法的相关资料,需要的朋友可以参考下
    2015-11-11

最新评论