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

前端技术 2023/09/08 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#程序设计有所帮助。

本文地址：https://www.stayed.cn/item/21667

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案