表单上传文件
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>测试文件上传</title>
</head>
<body>
<form action="/attach/upload" enctype="multipart/form-data" method="post"><input type="file" name="content" /> <br><input type="submit" value="上传" />
</form>
</body>
</html>
ajax文件上传
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>测试ajax文件上传</title><script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script><link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css"/><style>.upload_image_input_trigger {position: relative;display: inline-block;margin-left: 10px;margin-right: 10px;overflow: hidden;}.upload_image_input {position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;}.box {width:600px;margin: 50px auto;}</style>
</head>
<body>
<div class="box"><a href="javascript:;" style="margin-top:-4px;" class="btn btn-default upload_image_input_trigger"><span>上传图片</span><input class="upload_image_input" type="file" accept=".png, .jpg, .jpeg"></a>
</div><script>$(function(){$(".upload_image_input").on('change',function(){var cur_obj = $(this);var file_obj = this.files[0];if(file_obj === undefined){layer.msg('没有选择文件');return;}if (file_obj.size > 2097152) {layer.msg("图片大小不能超过2M");return;}var formData = new FormData();formData.append("type", "image");//其它参数formData.append("content", file_obj);//文件对象$.ajax({url: '/attach/upload',type: 'POST',dataType: "json",data: formData,cache: false,contentType: false,processData: false,beforeSend: function () {cur_obj.parent().find('span').html('上传中');},success: function(result){console.log(result);cur_obj.parent().find('span').html('上传图片完成');alert("success");}});});});
</script>
</body>
</html>
离开，只为更好的活着)
