<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Mood.aspx.cs" Inherits="Mood.Mood" %>
<!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">
<script src="https://www.jb51.net/SwfUpload/swfupload.js" type="text/javascript"></script>
<script src="https://www.jb51.net/jquery-1.7.1.js" type="text/javascript"></script>
<link href="https://www.jb51.net/Style/Mood.css" type="text/css" />
<title></title>
<script type="text/javascript">
$().ready(function () {
SetSwf();
$("#btnReply").click(function () {
$("#divImgs").hide();
});
});
var swfu;
function SetSwf() {
swfu = new SWFUpload({
// Backend Settings
upload_url: "Upload.ashx",
// File Upload Settings
file_size_limit: "20 MB",
file_types: "*.jpg;*.png;*jpeg;*bmp",
file_types_description: "JPG;PNG;JPEG;BMP",
file_upload_limit: "0", // Zero means unlimited
file_queue_error_handler: fileQueueError,
file_dialog_complete_handler: fileDialogComplete,
upload_progress_handler: uploadProgress,
upload_error_handler: uploadError,
upload_success_handler: uploadSuccess,
upload_complete_handler: uploadComplete,
// Button settings
button_image_url: "/Style/Image/4-16.png",
button_placeholder_id: "divBtn",
button_width: 26,
button_height: 26,
// Flash Settings
flash_url: "/swfupload/swfupload.swf",
custom_settings: {
upload_target: "divFileProgressContainer"
},
// Debug Settings
debug: false
});
}
// 文件校验
function fileQueueError(file, errorCode, message) {
try {
switch (errorCode) {
case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:
alert("上传文件有错误！");
break;
case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:
alert("上传文件超过限制（20M）！");
break;
case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:
case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:
default:
alert("文件出现错误！");
break;
}
} catch (ex) {
this.debug(ex);
}
}
// 文件选择完毕时触发
function fileDialogComplete(numFilesSelected, numFilesQueued) {
try {
if (numFilesQueued > 0) {
$("#divImgs").show();
for (var i = 0; i < numFilesQueued; i++) {
$("#ulUpload").append('<li><img src="https://www.jb51.net/style/image/loading.gif" alt="" /></li>');
}
this.startUpload();
}
} catch (ex) {
this.debug(ex);
}
}
// 滚动条的处理方法 暂时没写
function uploadProgress(file, bytesLoaded) {
}
// 每个文件上传成功后的处理
function uploadSuccess(file, serverData) {
try {
var index = file.id.substr(file.id.lastIndexOf('_') + 1);
$("#li" + index).html("");
$("#li" + index).html('<img src="' + serverData + '" alt=""/>');
index++;
} catch (ex) {
this.debug(ex);
}
}
// 上传完成后，触发下一个文件的上传
function uploadComplete(file) {
try {
if (this.getStats().files_queued > 0) {
this.startUpload();
}
} catch (ex) {
this.debug(ex);
}
}
// 单个文件上传错误时处理
function uploadError(file, errorCode, message) {
var imageName = "imgerror.png";
try {
var index = file.id.substr(file.id.lastIndexOf('_') + 1);
$("#li" + index).html("");
$("#li" + index).html('<img src="https://www.jb51.net/style/image/imgerror.png" alt=""/>');
index++;
} catch (ex3) {
this.debug(ex3);
}
}
</script>
</head>
<body>
<form runat="server">
<div>
<div>
文本框
</div>
<div>
<div>
</div>
<div>
<input type="button" value="发表" />
</div>
</div>
<div>
<div>
上传图片</div>
<ul>
</ul>
</div>
</div>
</form>
</body>
</html>
使用Vs2010开发，以下为项目源码地址
您可能感兴趣的文章: