function Index() { } //阻止浏览器默认行。 Index.prototype.HoldbackBorwser = function () { $(document).on({ dragleave: function (e) { //拖离 e.preventDefault(); }, drop: function (e) { //拖后放 e.preventDefault(); }, dragenter: function (e) { //拖进 e.preventDefault(); }, dragover: function (e) { //拖来拖去 e.preventDefault(); } }); } //监听拖拽事件 Index.prototype.MonitorDrop = function () { let self = this let box = document.getElementById('upload-btn-click'); //拖拽区域 box.addEventListener("drop", function (e) { e.preventDefault(); //取消默认浏览器拖拽效果 let fileList = e.dataTransfer.files; //获取文件对象 //循环遍历文件对象 for (let i = 0; i < fileList.length; i++) { //检测文件是不是图片 if (fileList[i].type.indexOf('image') === -1) { Alert.AlertError("您拖的不是图片!") return false; } //拖拉图片到浏览器,可以实现预览功能 // let img = window.URL.createObjectURL(fileList[i]); // let filename = fileList[i].name; //图片名称 // let filesize = Math.floor((fileList[0].size) / 1024); // if (filesize > 2048) { // Alert.AlertError("上传大小不能超过2M.") // return false; // } //上传 self.UploadFile(fileList[i]); } }, false); } //上传图片 Index.prototype.UploadFile = function (file) { let filesize = Math.floor((file.size) / 1024); if (filesize > 2048) { Alert.AlertError("上传大小不能超过2M.") return false; } let formData = new FormData(); formData.append('file', file); let csrfToken = document.getElementsByName("gorilla.csrf.Token")[0].value //开始上传图片 $.ajax({ url: '/upload', type: 'POST', data: formData, contentType: false, processData: false, headers: { "X-CSRF-Token": csrfToken }, success: function (result) { if (result.status === 200) { Alert.AlertSuccessToast("上传成功!") // alert("上传成功!文件名为:" + result.data); } else { Alert.AlertError(result.message) return false; } }, error: function () { Alert.AlertError("服务器内部错误") } }) } Index.prototype.UploadClick = function () { $("#upload-btn-click").click(function () { $("#upload-input-file").click() }) } Index.prototype.run = function () { this.HoldbackBorwser() this.MonitorDrop() this.UploadClick() } $(function () { let index = new Index() index.run() })