本文共 3762 字，大约阅读时间需要 12 分钟。
官方网没有.net版本 只有php版 下面是.net版
css:
.swiff-uploader-box a{
display: none !important;
}
a:hover, a.hover{
color: red;
}
#demo-status{
padding: 10px 15px;
width: 420px;
border: 1px solid #eee;
}
#demo-status .progress{
background: url(img/progress.gif) no-repeat;
background-position: +50% 0;
margin-right: 0.5em;
vertical-align: middle;
}
#demo-status .progress-text{
font-size: 0.9em;
font-weight: bold;
}
#demo-list{
list-style: none;
width: 450px;
margin: 0;
}
#demo-list li.validation-error{
padding-left: 44px;
display: block;
clear: left;
line-height: 40px;
color: #8a1f11;
cursor: pointer;
border-bottom: 1px solid #fbc2c4;
background: #fbe3e4 url(img/failed.png) no-repeat 4px 4px;
}
#demo-list li.file{
border-bottom: 1px solid #eee;
background: url(img/file.png) no-repeat 4px 4px;
overflow: auto;
}
#demo-list li.file.file-uploading{
background-image: url(img/uploading.png);
background-color: #D9DDE9;
}
#demo-list li.file.file-success{
background-image: url(img/success.png);
}
#demo-list li.file.file-failed{
background-image: url(img/failed.png);
}
#demo-list li.file .file-name{
font-size: 1.2em;
margin-left: 44px;
display: block;
clear: left;
line-height: 40px;
height: 40px;
font-weight: bold;
}
#demo-list li.file .file-size{
font-size: 0.9em;
line-height: 18px;
float: right;
margin-top: 2px;
margin-right: 6px;
}
#demo-list li.file .file-info{
display: block;
margin-left: 44px;
font-size: 0.9em;
line-height: 20px;
clear}
#demo-list li.file .file-remove{
clear: right;
float: right;
line-height: 18px;
margin-right: 6px;
}
js:
window.addEvent('domready', function() {
varup = newFancyUpload2($('demo-status'), $('demo-list'), {
verbose: true,
url: $('form-demo').action,
path: 'js/Swiff.Uploader.swf',
typeFilter: {
'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'},
target: 'demo-browse',
onLoad: function() {
$('demo-status').removeClass('hide');
$('demo-fallback').destroy();
this.target.addEvents({
click: function() {
return false;
},
mouseenter: function() {
this.addClass('hover');
},
mouseleave: function() {
this.removeClass('hover');
this.blur();
},
mousedown: function() {
this.focus();
}
});
$('demo-clear').addEvent('click', function() {
up.remove();
return false;
});
$('demo-upload').addEvent('click', function() {
up.start();
return false;
});
},
onSelectFail: function(files) {
files.each(function(file) {
newElement('li', {
'class': 'validation-error',
html: file.validationErrorMessage || file.validationError,
title: MooTools.lang.get('FancyUpload', 'removeTitle'),
events: {
click: function() {
this.destroy();
}
}
}).inject(this.list, 'top');
}, this);
},
onFileSuccess: function(file, response) {
varjson = newHash(JSON.decode(response, true) || {});
if(json.get('status') == '1') {
file.element.addClass('file-success');
file.info.set('html', 'Image was uploaded: '+ json.get('width') + ' x '+ json.get('height') + 'px, '+ json.get('mime') + ')');
} else{
file.element.addClass('file-failed');
file.info.set('html', 'An error occured: '+ (json.get('error') ? (json.get('error') + ' #'+ json.get('code')) : response));
}
},
onFail: function(error) {
switch(error) {
case'hidden':
alert('To enable the embedded uploader, unblock it in your browser and refresh (see Adblock).');
break;
case'blocked':
alert('To enable the embedded uploader, enable the blocked Flash movie (see Flashblock).');
break;
case'empty':
alert('A required file was not found, please be patient and we fix this.');
break;
case'flash':
alert('To enable the embedded uploader, install the latest Adobe Flash plugin.')
}
}
});
});
html:
File Upload
This form is just an example fallback for the unobtrusive behaviour of FancyUpload.
If this part is not changed, something must be wrong with your code.
Upload a Photo:
浏览|
清除列表|
上传
转载地址：http://dodnv.baihongyu.com/