一个 JS 方法,为什么第一行的代码不是执行到这行就有效果 ， 而是等到 整个方法结束 才显示效果？

这个 是做 一个 显示遮罩层 ，就是很奇怪，下面 有一个 ajax 分片上传方法， 会等到 上传结束后 才有 遮罩层 的 效果，

本意是 先 有 遮罩层 的 显示效果， 再往下执行 ajax， Ajax 执行结束 后 ，去掉遮罩层 ，但是发现了这个问题，希望有大佬指点下

是在fastadmin 快速开发框架，后台命令一键生成 的 添加页面 写的代码，正在测试 脱离框架 会不会也这样

<script>
    /* 显示遮罩层 */
    function showOverlay() {
        $("#displayBox").css('display','block');
        $("#displayBox").height(document.body.scrollHeight);
        $("#displayBox").width(document.body.scrollWidth);
        // fadeTo第一个参数为速度，第二个为透明度
        // 多重方式控制透明度，保证兼容性，但也带来修改麻烦的问题
        $("#displayBox").fadeTo(200, 0.5);
        // 解决窗口缩小时放大后不全屏遮罩的问题
        // 简单来说，就是窗口重置的问题
        $('#upload').attr('disabled','disabled');
    }
    /* 隐藏覆盖层 */
    function hideOverlay() {
        $("#displayBox").fadeOut(200);
        $("#displayBox").css('display','none');
        $('#upload').removeAttr('disabled');
    }
</script>

 $(function(){
        // page.init();
        $("#upload").on('click',function () {
            $('#upload').attr('disabled','disabled');
            alert('点击确认开始上传视频，大文件上传会比较慢，请不要继续点击，耐心等待。');
            return false;
            var file = $("#file")[0].files[0],  //文件对象
                name = file.name,        //文件名
                size = file.size,        //总大小
                succeed = 0;

            var shardSize = 2 * 1024 * 1024,     //以2MB为一个分片
                shardCount = Math.ceil(size / shardSize);   //总片数

            for(var i = 0;i < shardCount;++i){
                //计算每一片的起始与结束位置
                var start = i * shardSize,
                    end = Math.min(size, start + shardSize);

                //构造一个表单，FormData是HTML5新增的
                var form = new FormData();
                form.append("data", file.slice(start,end));  //slice方法用于切出文件的一部分
                form.append("name", name);
                form.append("total", shardCount);   //总片数
                form.append("index", i + 1);        //当前是第几片

                //Ajax提交
                $.ajax({
                    url: "/admin/video/datastudentvideo/upload",
                    type: "POST",
                    data: form,
                    async: false,         //
                    processData: false,  //很重要，告诉jquery不要对form进行处理
                    contentType: false,  //很重要，指定为false才能形成正确的Content-Type
                    beforeSend:function(XMLHttpRequest){
                        console.log('远程调用开始');
                    },
                    success: function(reponse){
                        ++succeed;
                        $("#c-url").val(reponse);
                        console.log('asdasdas1111');
                        console.log(reponse);
                        console.log($("#c-url").val());
                        console.log($("#c-url"));
                        $("#output").text(succeed + " / " + shardCount);
                    }
                });

            }
            hideOverlay();
        })
    });