html中一些标签的特殊用法

160 阅读1分钟

form表单的 onsubmit="return hanshu()"

<form id="fileForm" action="/image/upload" onsubmit="return checkFileSize()" method="post"
                  enctype="multipart/form-data" class="navbar-form navbar-left">
                <div class="form-group" style="border-color: #3c3c3c">
                    <input id="files" class="form-control" type="file" name="upload" multiple required>
                    <input type="submit" class="btn btn-success" value="上传"/>
                </div>
            </form>
function checkFileSize() {
        let files = document.getElementById("files").files;
        for (let i = 0; i < files.length; i++) {
            if (files[i].size > 1024 * 1024 * 20) {
                alert("请上传小于20M的图片!");
                document.getElementById("fileForm").reset();
                return false;
            }
        }
        return true;
    }

其含义是在表单提交前执行checkFileSize()函数,若返回false则表单停止提交,反之继续提交