У меня есть этот код для обрезки изображения с использованием плагина jquery croppie и загрузки с использованием модального режима начальной загрузки. в моем случае я работаю с FileReader
$(document).ready(function(){
$image_crop = $('#image_demo').croppie({
enableExif: true,
viewport: {
width:200,
height:300,
type:'square' //circle
},
boundary:{
width:300,
height:300
}
});
var fileTypes = ['jpg', 'jpeg', 'png'];
$('#upload_image').on('change', function(){
var reader = new FileReader();
reader.onload = function (event) {
$image_crop.croppie('bind', {
url: event.target.result
}).then(function(){
console.info('jQuery bind complete');
});
}
reader.readAsDataURL(this.files[0]);
$('#uploadimageModal').modal('show');
});
$('.crop_image').click(function(event){
$image_crop.croppie('result', {
type: 'canvas',
size: 'viewport'
}).then(function(response){
$.ajax({
url:"../account/edit/profileimage",
type: "POST",
//dataType:"json",
data:{"image": response},
success:function(data)
{
/*
if (response.status === 'error'){
$('#uploadimageModal').animate({ scrollTop: $('#uploaderror').offset().top }, 500);
$('#uploaderror').html(response.message);
}
else {
*/
$('#uploadimageModal').modal('hide');
$('#uploaded_image').html(data);
/*
}
*/
}
});
})
});
});
Теперь в действии мне нужно проверить проверку типа файла и показать предупреждение перед загрузкой модального окна. как я могу показать предупреждающее сообщение ?!



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Взгляните на приведенный ниже код. Надеюсь, поможет
var fileTypes = ['jpg', 'jpeg', 'png'];
$('#upload_image').on('change', function() {
var reader = new FileReader();
var file = this.files[0]; // Get your file here
var fileExt = file.type.split('/')[1]; // Get the file extension
if (fileTypes.indexOf(fileExt) !== -1) {
reader.onload = function(event) {
$image_crop.croppie('bind', {
url: event.target.result
}).then(function() {
console.info('jQuery bind complete');
});
}
reader.readAsDataURL(file);
$('#uploadimageModal').modal('show');
} else {
alert('File not supported');
}
});
Проверьте тип MIME файла, а не расширение файла: stackoverflow.com/questions/18299806/…