html 上传 input type="file" 只允许上传图片文件

<from action="" enctype="multipart/form-data" method="post">
    <a>
        <span>修改头像</span>
        <input type="file" id="fileUp" accept="image/png,image/jpeg">
    </a>
</from>

var fileM=document.querySelector("#fileUp");
$("#fileUp").on("change",function() {
    //获取文件对象,files是文件选取控件的属性,存储的是文件选取控件选取的文件对象,类型是一个数组
    var fileObj = fileM.files[0];
    //创建formdata对象,formData用来存储表单的数据,表单数据时以键值对形式存储的。
    var formData = new FormData();
    formData.append('file', fileObj);
    $.ajax({
        url: "自己的后台的Url",
        type: "post",
        dataType: "json",
        data: formData,
        async: false,
        cache: false,
        contentType: false,
        processData: false,
        success: function (json_data) {
            alert("恭喜你!上传成功");
        },
    });
});

猜你喜欢

转载自blog.csdn.net/sd19871122/article/details/82817782