14.01.2013 19:51:43 При выборе изображения - появляется его превью Сообщение #1
KotOFF
Освоившийся
Дата регистрации:
25.05.2012 10:21:29
Сообщений: 33
Помогите исправить Script, что-бы можно было загружать только один раз изображения (на данный момент - загружает изображение, но - после первого, можно загружать изображения бесконечно)!Как это исправить, ПОМОГИТЕ!!!
<html>
<head>
<title>При выборе изображения - появляется его превью в указанном месте еще до загрузки.</title>
<style>
.thumb {
height: 75px;
border: 1px solid #000;
margin: 10px 5px 0 0;
}
</style>
</head>
<body>
<br><br><h4>file Image</h4><br<br><input name="fileAttach[]" type="file" id="files1" /><br />
<output id="list1"></output>
<script>
//alert(0);
function handleFileSelect(evt,list) {
var files = evt.target.files;
for (var i = 0, f; f = files[i]; i++) {
if (!f.type.match('image.*')) {
continue;
}
; var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
var span = document.createElement('span');
span.innerHTML = ['<img class="thumb" src="', e.target.result,
'" title="', escape(theFile.name), '"/>'].join('');
document.getElementById(list).insertBefore(span, null);
};
})(f);
reader.readAsDataURL(f);
}
}
;
document.getElementById('files1').addEventListener('change', function(e){handleFileSelect(e,'list1')}, false);
</script>
<style>
#bn {display:block;}
#bt {display:block;}
</style>
</body>
</html>
<html>
<head>
<title>При выборе изображения - появляется его превью в указанном месте еще до загрузки.</title>
<style>
.thumb {
height: 75px;
border: 1px solid #000;
margin: 10px 5px 0 0;
}
</style>
</head>
<body>
<br><br><h4>file Image</h4><br<br><input name="fileAttach[]" type="file" id="files1" /><br />
<output id="list1"></output>
<script>
//alert(0);
function handleFileSelect(evt,list) {
var files = evt.target.files;
for (var i = 0, f; f = files[i]; i++) {
if (!f.type.match('image.*')) {
continue;
}
; var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
var span = document.createElement('span');
span.innerHTML = ['<img class="thumb" src="', e.target.result,
'" title="', escape(theFile.name), '"/>'].join('');
document.getElementById(list).insertBefore(span, null);
};
})(f);
reader.readAsDataURL(f);
}
}
;
document.getElementById('files1').addEventListener('change', function(e){handleFileSelect(e,'list1')}, false);
</script>
<style>
#bn {display:block;}
#bt {display:block;}
</style>
</body>
</html>