我正在使用 Croppie.js 在我的网站上裁剪和上传图像。但是,我发现在浏览图像时,它还会显示视频和其他格式文件,甚至正在选择它。我搜索了解决方案的文档,但找不到。它确实在文档中说明了支持 jpeg 和 png 的格式,但这只是结果。我没有找到限制显示视频文件的方法。任何帮助,将不胜感激。
代码:
// Croppie
var resize = $('#upload-demo').croppie({
enableExif: true,
enableOrientation: true,
viewport: { // Default { width: 100, height: 100, type: 'square' }
width: 300,
height: 300,
type: 'circle' //square
},
boundary: {
width: 325,
height: 325
}
});
$('#image').on('change', function () {
var reader = new FileReader();
reader.onload = function (e) {
resize.croppie('bind',{
url: e.target.result
}).then(function(){
// console.log('jQuery bind complete');
});
}
reader.readAsDataURL(this.files[0]);
});
$('.btn-upload-image').on('click', function (ev) {
resize.croppie('result', {
type: 'canvas',
size: 'viewport'
}).then(function (img) {
var imgval = $('#image').val();
var dataString = {
image: img,
imgval: imgval
};
$.ajax({
type: "POST",
dataType : "json",
url: "processes/avatar.php",
data: dataString,
beforeSend: function(){
$('.message').hide();
$(".btn-upload-image").html('Please wait...');
},
success: function (json) {
$(".message").html(json.msg).fadeIn();
$('#preview-image').attr('src', json.preview);
$(".btn-upload-image").html('Upload');
}
});
});
});