Изображения добавляются как миниатюры, но код для операции удаления не работает. Это мой код ....
что-то пошло не так в «span.innerHtml», я знаю ... но не в состоянии его решить !!
Сценария для операции удаления, как Ненужная ссылка работает нормально .... но когда интегрировано с изображениями в виде эскизов он не работает ....Хотите удалить изображения, добавляемые к эскизам при нажатии ссылки удаления.
//select the files to be added
<input type="file" id="files" name="files[]"/>
<output id="list"></output>
//code for delete operation(after onClick)
<script>
$(document).ready(function(){
$('a.delete').on('click',function(e){
e.preventDefault();
imageID = $(this).closest('.image')[0].id;
alert('Now deleting "'+imageID+'"');
$(this).closest('.image')
.fadeTo(300,0,function(){
$(this)
.animate({width:0},200,function(){
$(this)
.remove();
});
});
});
});
</script>
//code to add images to thumbnails(before onClick)
<script>
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
// Loop through the FileList and render image files as thumbnails.
for (var i = 0, f; f = files[i]; i++) {
// Only process image files.
if (!f.type.match('image.*')) {
continue;
}
var reader = new FileReader();
// Closure to capture the file information.
reader.onload = (function(theFile) {
return function(e) {
// Render thumbnail.
var span = document.createElement('span');
span.innerHTML = ['<a href="#" class="delete">Delete<img class="thumb" src="', e.target.result,
'" title="', escape(theFile.name), '" width="110" height="150"/></a>'].join('');
document.getElementById('list').insertBefore(span, null);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
Когда вы говорите _delete_ вы имеете в виду удаление их со страницы, не так ли? – Joum
Да ... точно ... – Rohini
Не могли бы вы разместить HTML _before_ и _after_ 'onClick'? – Joum