如何在 JavaScript 中过滤图像的文件类型？

Question

如何在此代码中过滤图像类型？我只想允许 jpg, jpeg and png only 的文件类型？

我确实尝试过使用此代码，但无法正常工作

$(".doc").click(function()  {$("#doc_attach").click();});
        $("#doc_attach").change(function()
        {
            let width  = 0;
            let height = 0;
            let photo  = $(this).prop("files")[0];

            if(photo.type == 'image/jpg' || photo.type == 'image/png' || photo.type == 'image/jpeg' ){
                let index;
                index = doc_temp.push({"file": photo}) - 1;
                   ....
                }
                else if( photo.type == 'application/pdf'){
                    let index;
                    index = doc_temp.push({"file": photo}) - 1;  
                }
                else{
                    Swal.fire({
                    icon: 'error',
                    title: 'Oops...',
                    text: 'Sorry only file type with jpg and pdf are allowed!',
                    
                    })
                }

        });

我尝试使用png 上传图片，但错误并出现oops 弹出窗口。如何正确过滤？

Answer 1

您也可以使用 html 输入的 'accept' 属性来实现这一点。像这样：

<input type="file" name="myImage" accept="image/png, image/jpeg, image/jpg" />