layui文件上传中如何先判断后再弹出文件选择框

前言:layui中的上传,如何在点击上传按钮前阻止file的默认打开文件选择框呢?我想点击后先判断下,如果判断结果不符合,就直接弹出提示框,而不是文件选择框,判断符合才进行文件选择。
但是在layui的uplode.render里的before和choose都试了,始终避免不了。在外面也绑定了click事件,还是不行。绑定了click的return false,都不行。

<button type="button" class="layui-btn layui-btn-normal" onclick="test()">先检查再选图片的按钮</button>
<button type="button" id="idUpload">上传图片</button><!-- 这个按钮你给隐藏一下嘛 -->

<script>
layui.use('layer', function(){
        var layer = layui.layer;
    });
    layui.use('upload', function(){

        var $ = layui.jquery  ,upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#idUpload'
            ,url: '/files' //改成您自己的上传接口
            ,multiple: true
            ,accept: 'images'
            ,acceptMime: 'image/jpg, image/png, image/jpeg'
            ,exts:'jpg|png|jpeg'
            ,data: {
                communityid: function(){
                    return $("#communityid").val();
                },
                picpath: function(){
                    var citystr= $('#city').find("option:selected").text();
                    var townstr=$('#town').find("option:selected").text();
                    var communitystr=$('#communityid').find("option:selected").text();
                    var s = "/湘潭党群服务中心/"+citystr+"/"+townstr+"/"+communitystr+"/";
                    return s ;

                }
            }
            ,before: function(obj){

                 layer.load(); //上传loading
            }
            ,done: function(res){
                //如果上传失败
                layer.closeAll('loading');
                if(res.code > 0){
                    return layer.msg('上传失败');
                }else {
                     layer.msg('上传成功');

                    example.ajax.reload();
                    return;
                }
                //上传成功
            }
            ,error: function(){
                layer.closeAll('loading');
                //失败状态,并实现重传
               /* var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });*/
            }
        }); 
});
function test() {
    //在此做你的检查
    $(‘#idUpload‘).click(); //检查通过再选上传图片
}
</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值