ajax上传文件,限制图片格式

本文介绍了一种使用HTML和JavaScript实现的图片上传方法,包括文件格式的校验及通过Ajax进行图片上传的全过程。重点讲解了如何利用JavaScript检查上传文件是否为PNG或JPG格式,并在确认格式正确后,利用FormData对象和Ajax将图片发送到服务器。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

html:

<input type="file" name="diyProtalImg" style="display: none" id="diyProtalImg" οnchange="ajaxUpload()"/>

js:

function ajaxUpload(){
        var _name, _fileName, personsFile;
        personsFile = document.getElementById("diyProtalImg");
        _name = personsFile.value;
        _fileName = _name.substring(_name.lastIndexOf(".") + 1).toLowerCase();
        if (_fileName !== "png" && _fileName !== "jpg") {
            alert("上传图片格式不正确,请重新上传");
            return;
        }
       
        var formdata=new FormData();
         var obj=$("#diyProtalImg")[0].files[0];
         formdata.append('diyProtalImg',obj);
        $.ajax({
            url:'<%=basePath%>tenantConfigManage/uploadDiyProtalImg.action',
            type:'POST',
            data:formdata,
            cache:false,
            contentType:false,
            processData:false,
            success:function(data){
                if(data=="max"){
                    alert("文件过大,上传失败!");
                }else if((data=="error")||(data=="上传失败")){
                    alert("文件上传失败");
                }else{
                $("#diyProtalImgUrl").val(data);
                     }
            }
        });

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值