jquery控制上传文件格式、大小以及图片预览功能

最新推荐文章于 2024-07-26 16:44:35 发布

Luxus_C

最新推荐文章于 2024-07-26 16:44:35 发布

阅读量2.0k

点赞数

分类专栏： JavaScript代码文章标签： jquery 文件上传

本文链接：https://blog.csdn.net/luchengbing0120/article/details/78160522

版权

该博客介绍如何使用jQuery来控制文件上传时的格式（仅限jpg、png、gif）和大小（不超过5MB），并提供图片预览功能。当选择不符合条件的文件时，会禁用上传按钮。同时，博客中包含一个函数用于获取File对象的URL，以便在页面上展示预览图像。

摘要由CSDN通过智能技术生成

通过jquery控制上传文件的格式、大小；当选择图片时，能在页面上提供图片预览的功能。

$("#picture").change(function () {
    var s = $('#picture').val();
    var start = s.indexOf(".") + 1;
    var name = s.substring(start, s.length).toLowerCase();
    if (name != "jpg" && name != "png" && name != "gif") {
        alert("图片格式必须为jpg、png、gif中的一种");
        $("[value='上传']").attr("disabled", true);
        return;
    }
    if (this.files[0].size / 1024 / 1024 > 5) {
        alert("图片不能超过5M");
        $("[value='上传']").attr("disabled", true);
        return;
    }
    var objUrl = getObjectURL(this.files[0]);
    if (objUrl) {
        $("#img0").attr("src", objUrl);
    }
    $("[value='上传']").attr("disabled", false);
});