欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

LayUI upload上传组件使用exts属性指定上传文件的后缀名,过滤掉其他格式的文件

程序员文章站 2022-06-19 15:48:57
1 HTML代码
2 JS代码$(function(){ initUpload();});//初始化上传组件function initUpload(){ layui.use(['upload'], function () { var upload = layui.uploa...

1 HTML代码

<input type='button' id='selectFile' value='选择文件'>
<div id='fileDiv'></div>

2 JS代码

$(function(){
    initUpload();
});
//初始化上传组件
function initUpload(){
    layui.use(['upload'], function () {
        var upload = layui.upload;
        //单文件上传
        upload.render({
            elem: '#selectFile',
            url: "upload.aspx",
            accept: 'file',
            exts: 'jpg|png',//限制上传文件的后缀名,用|分隔
            multiple: false,
            auto: true,//是否自动上传,true自动上传,false手动上传
            size: 50 * 1024,//单位kb
            choose: function (obj) {
                obj.preview(function (index, file, result) {
                    $("#fileDiv").val(file.name);
                });
            },
            done: function (res, index, upload) {
                if (res.Code == 1) { //上传成功
                    alert("上传成功");
                }
                else {
                    alert("上传失败!");
                }
            },
            error: function (index, upload) {
                alert("上传失败!");
            }
        });
    });
}

3 最终效果图

LayUI upload上传组件使用exts属性指定上传文件的后缀名,过滤掉其他格式的文件

本文地址:https://blog.csdn.net/qq_38974638/article/details/110967812

相关标签: Layui