springboot项目中利用ajaxfileupload进行图片上传

最新推荐文章于 2022-05-19 14:49:32 发布

Irving_Ma

最新推荐文章于 2022-05-19 14:49:32 发布

阅读量1.4k

点赞数 1

分类专栏： utils-java utils-web 文章标签： utils ajaxfileupload uploadImg

本文链接：https://blog.csdn.net/Irving_Ma/article/details/88977535

版权

引入html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
	<script src="index.js"></script>
	<script src="ajaxfileupload.js"></script>
	<style>
        .whiteBtn {
            background-color: white;
            color: red;
            border: red 2px solid;
            font-weight: bold;
        }
    </style>
</head>
<body>
	<!--保存活动图片-->
                <div class="col-sm-12" style="background: white; padding:10px 0 10px 0;border-left: 1px darkgray solid;
                                            border-right: 1px darkgray solid;">
                    <h4 style="display: inline-block;float: left; margin: 0 0 0 4%;">PC端&nbsp;&nbsp;图片:</h4>
                    <div class="col-sm-2" style="margin: 0 0 0 2%;padding-left: 5px">
                        <img id="image_1" src="../../images/test.jpg" style="width: 300px;height: 150px">
                        <input type="hidden" style="float:left;margin: 6px 0 0 5px;" id="imgName1" name="imgName"
                               data-type="1">
                    </div>
                    <button type="button" style="border-color: #428bca;color: #428bca"
                            class="btn whiteBtn" id="updateBtn_1" onclick="showUploadDiv(1)">修&nbsp;&nbsp;改
                    </button>
                    <div class="col-sm-2" id="uploadDiv_1" style="display: none;">
                        <form id="form4" enctype="multipart/form-data" class="col-sm-2" style="padding-left: 0px">
                            <input type="file" style="float:left;margin: 6px 0 0 150px;" id="up_1" name="up_name_1"
                                   accept="image/*" onchange="changImg(event,1,1)">
                        </form>
                    </div>
                </div>
                <div class="col-sm-12" style="background: white; padding:10px 0 10px 0; border-bottom: 1px darkgray solid;
                                                     border-left: 1px darkgray solid; border-right: 1px darkgray solid;">
                    <h4 style="display: inline-block;float: left; margin: 0 0 0 4%;">微信端图片:</h4>
                    <div class="col-sm-2" style="margin: 0 0 0 2%;padding-left: 5px">
                        <img id="image_2" src="../../images/test.jpg" style="width: 150px;height: 75px">
                        <input type="hidden" style="float:left;margin: 6px 0 0 5px;" id="imgName2" name="imgName"
                               data-type="2">
                    </div>
                    <button type="button" style="border-color: #428bca;color: #428bca"
                            id="updateBtn_2" class="btn whiteBtn" onclick="showUploadDiv(2)">修&nbsp;&nbsp;改
                    </button>
                    <div class="col-sm-2" id="uploadDiv_2" style="display: none;">
                        <form id="form5" enctype="multipart/form-data" class="col-sm-2" style="padding-left: 0px">
                            <input type="file" style="float:left;margin: 6px 0 0 5px;" id="up_2" name="up_name_2"
                                   accept="image/*" onchange="changImg(event,2,2)">
                        </form>
                    </div>
                </div>
</body>

引入js

/**
 * 显示修改图片的上传div
 */
function

最低0.47元/天解锁文章

Irving_Ma

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
springboot项目中利用ajaxfileupload进行图片上传

引入html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <meta content="width=device-width, initial-scale=1.0,...
复制链接

扫一扫