C#完成圖片上傳與閱讀切換的辦法。本站提示廣大學習愛好者:(C#完成圖片上傳與閱讀切換的辦法)文章只能為提供參考,不一定能成為您想要的結果。以下是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 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 src="' + data + '"/>');
return;
}
$(this).parent().parent().parent().mou搜索引擎優化ver(function() { $(this).addClass('hover'); }).mou搜索引擎優化ut(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').mou搜索引擎優化ut().unbind('mou搜索引擎優化ver');
});
if ($.browser.msie) {
$('#memberPhoto').filter('.support').mou搜索引擎優化ver(function() { $(this).addClass('hover'); }).mou搜索引擎優化ut(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" >
<%if (!string.IsNullOrEmpty(imagePath))
{%>
<div class="preview">
<img src="../<%=imagePath%>" /></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#法式設計有所贊助。