|
@@ -44,7 +44,58 @@
|
|
|
<script type="text/javascript"
|
|
|
src="${pageContext.request.contextPath}/static/admin/icheck/jquery.icheck.min.js"></script>
|
|
|
<script src="${pageContext.request.contextPath}/static/admin/manage/js/WdatePicker.js"></script>
|
|
|
-
|
|
|
+ <style>
|
|
|
+ .selfprozslidim dd {
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ display: inline-block;
|
|
|
+ height: 68px;
|
|
|
+ margin: 0 0 10px 10px ;
|
|
|
+ position: relative;
|
|
|
+ width: 68px;
|
|
|
+ }
|
|
|
+ .selfprozslidim dd img {
|
|
|
+ display: block;
|
|
|
+ height: 68px;
|
|
|
+ width: 68px;
|
|
|
+ }
|
|
|
+ .selfprozslidim dd i {
|
|
|
+ background: #999;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ cursor: pointer;
|
|
|
+ display: none;
|
|
|
+ height: 13px;
|
|
|
+ position: absolute;
|
|
|
+ right: 3px;
|
|
|
+ top: 3px;
|
|
|
+ width: 13px;
|
|
|
+ }
|
|
|
+ #albummore a{cursor:pointer;}
|
|
|
+ .selfprozslidim dd:hover i {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .selfprozslidim dd i:hover {
|
|
|
+ background-color: #3388ff;
|
|
|
+ }
|
|
|
+ .delwarp {
|
|
|
+ display:none;
|
|
|
+
|
|
|
+ padding: 5px 7px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 2;
|
|
|
+ }
|
|
|
+ .delete {
|
|
|
+ background: rgba(0, 0, 0, 0) url("${pageContext.request.contextPath}/static/images/del.png") no-repeat scroll 0 0 / 15px 19px;
|
|
|
+ display: block;
|
|
|
+ height: 19px;
|
|
|
+ text-indent: -9999px;
|
|
|
+ width: 15px;
|
|
|
+ }
|
|
|
+ .selfprozslidim dd.del:hover .delwarp {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
<script type="text/javascript">
|
|
|
$(function () {
|
|
|
$("#sub").click(function () {
|
|
@@ -113,41 +164,19 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <%--<div class="row cl">
|
|
|
- <label class="form-label col-xs-4 col-sm-1"><span class="c-red"></span>广告图:</label>
|
|
|
- <div class="formControls col-xs-8 col-sm-9">
|
|
|
- <input type="file" multiple="multiple" id="photo" class="input-text" id="phone" name="photo"/>
|
|
|
- <%– <label style="color:red" >建议尺寸:220px*220px</label>–%>
|
|
|
-
|
|
|
- <div id="imgDiv">
|
|
|
|
|
|
- <c:forEach items="${list}" var="list">
|
|
|
- <img src="${list}" alt="" id="showImg" style="width:100px;height: 100px;">
|
|
|
- </c:forEach>
|
|
|
-
|
|
|
- </div>
|
|
|
- <input type="text" id="morePhoto" name="activityimage" value="" hidden="hidden"/>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>--%>
|
|
|
<div class="row cl">
|
|
|
- <label class="form-label col-xs-4 col-sm-1"><span class="c-red"></span>广告图:</label>
|
|
|
+ <label class="form-label col-xs-4 col-sm-1">广告图:</br><span class="c-red">*不超过三张</span></label>
|
|
|
<div class="formControls col-xs-8 col-sm-9">
|
|
|
- <input type="file" class="input-text" multiple="multiple" id="photo" name="photo"/>
|
|
|
- <div id="imgDiv">
|
|
|
- <c:if test="${list != null}">
|
|
|
- <c:forEach items="${list}" var="list" >
|
|
|
- <dd class="del" style="float: left"><img src="${list}" alt="" style="width:100px;height: 100px;">
|
|
|
- <input type="hidden" name="eachImg" value="${list}"/>
|
|
|
- <div class="delwarp">
|
|
|
- <button class="delete" onclick="delalbum(this)">删除</button>
|
|
|
- </div>
|
|
|
- </dd>
|
|
|
+ <div style="width:100%;height:auto;border:1px solid #DDDDDD;padding:8px 5px 0 0;" class="selfprozslidim">
|
|
|
+ <dl>
|
|
|
+ <input type="file" style="display: none;" name="fileToUpload" class="selfbasetlimgedup" id="fileToUpload">
|
|
|
+ <c:forEach items="${list }" var="pics">
|
|
|
+ <dd class="del"><img src="${pics}" width="68" height="68" /><input type="hidden" name="activityimage" value="${pics }"/><div class="delwarp"><a class="delete" onclick="delalbum(this)"></a></div></dd>
|
|
|
</c:forEach>
|
|
|
- </c:if>
|
|
|
-
|
|
|
+ <dd id="albummore"><a onclick="$('#fileToUpload').click();"><img src="${pageContext.request.contextPath}/static/images/addmore.jpg" alt="" id="img"></a></dd>
|
|
|
+ </dl>
|
|
|
</div>
|
|
|
- <input type="text" id="morePhoto" name="activityimage" value="" hidden="hidden"/>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -195,79 +224,6 @@
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
- // 移除图片
|
|
|
- function delalbum(obj) {
|
|
|
- $(obj).parents(".del").remove();
|
|
|
- }
|
|
|
-
|
|
|
- $('#photo').change(function(){
|
|
|
-
|
|
|
- var formData = new FormData();
|
|
|
- var files = document.querySelector('input[name="photo"]').files;
|
|
|
- if(files.length>0){
|
|
|
- for (var i=0; i<files.length; i++) {
|
|
|
- formData.append("photo",files[i]);
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- $.ajax({
|
|
|
- url : '/nvrnetwork/admin/uploadImg',
|
|
|
- data: formData,
|
|
|
- type: 'POST',
|
|
|
- cache: false,
|
|
|
- async : false,
|
|
|
- dataType: "json",
|
|
|
- processData: false,
|
|
|
- contentType: false,
|
|
|
- success : function(response) {
|
|
|
- if(response.is){
|
|
|
- console.log(response.data);
|
|
|
- if(response.data.length > 0){
|
|
|
- for(var i=0;i<response.data.length;i++){
|
|
|
-
|
|
|
- var faceImg = response.data[i];
|
|
|
- $("#imgDiv").after('<dd class="del" style="float: left"> <img src="'+faceImg+'" alt="'+faceImg+'" style="width:100px;height: 100px;"> <input type="hidden" name="eachImg" value="' + faceImg + '"/> <div class="delwarp"><button class="delete" onclick="delalbum(this)">删除</button></div></dd>')
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
-
|
|
|
- /* 回显图片*/
|
|
|
- $(function () {
|
|
|
- $("#caseimage").change(function () {
|
|
|
- var $file = $(this);
|
|
|
-
|
|
|
- var length = $file.length;
|
|
|
- if (length==1){
|
|
|
-
|
|
|
- $("#showImg").show();
|
|
|
- }
|
|
|
-
|
|
|
- var fileObj = $file[0];
|
|
|
-
|
|
|
- var windowURL = window.URL || window.webkitURL;
|
|
|
- var dataURL;
|
|
|
- var $img = $("#showImg");
|
|
|
-
|
|
|
- if (fileObj && fileObj.files && fileObj.files[0]) { /*把零改为了i*/
|
|
|
- dataURL = windowURL.createObjectURL(fileObj.files[0]);/*把零改为了i*/
|
|
|
- $img.attr('src', dataURL);
|
|
|
- } else {
|
|
|
- dataURL = $file.val();
|
|
|
- var imgObj = document.getElementById("showImg");
|
|
|
- // 两个坑:
|
|
|
- // 1、在设置filter属性时,元素必须已经存在在DOM树中,动态创建的Node,也需要在设置属性前加入到DOM中,先设置属性在加入,无效;
|
|
|
- // 2、src属性需要像下面的方式添加,上面的两种方式添加,无效;
|
|
|
- imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
|
|
|
- imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;
|
|
|
-
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
|
|
|
|
|
|
|
|
@@ -318,6 +274,54 @@
|
|
|
</script>
|
|
|
|
|
|
|
|
|
+<%-- 多图上传 --%>
|
|
|
+<script type="text/javascript">
|
|
|
+ $(function(){
|
|
|
+ $("#fileToUpload").change(function(){
|
|
|
+ var f = document.getElementById('fileToUpload').files[0];
|
|
|
+ $.ajaxFileUpload({
|
|
|
+ fileElementId : 'fileToUpload',
|
|
|
+ url : 'uploadImages.html',
|
|
|
+ dataType : 'text',
|
|
|
+ data : {},
|
|
|
+ async : true,
|
|
|
+ error : function(data) {
|
|
|
+ alert("网络异常,请重试");
|
|
|
+ },
|
|
|
+ success : function(message) {
|
|
|
+ $("#albummore").before('<dd class="del"><img src="'+message+'" width="68" height="68" /><input type="hidden" name="activityimage" value="'+message+'"/><div class="delwarp"><a class="delete" onclick="delalbum(this)">删除</a></div></dd>');
|
|
|
+ chens();
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ function chens(){
|
|
|
+ $("#fileToUpload").change(function(){
|
|
|
+ var f = document.getElementById('fileToUpload').files[0];
|
|
|
+ $.ajaxFileUpload({
|
|
|
+ fileElementId : 'fileToUpload',
|
|
|
+ url : 'uploadImages.html',
|
|
|
+ dataType : 'text',
|
|
|
+ data : {},
|
|
|
+ async : true,
|
|
|
+ error : function(data) {
|
|
|
+ alert("网络异常,请重试");
|
|
|
+ },
|
|
|
+ success : function(message) {
|
|
|
+ $("#albummore").before('<dd class="del"><img src="'+message+'" width="68" height="68" /><input type="hidden" name="activityimage" value="'+message+'"/><div class="delwarp"><a class="delete" onclick="delalbum(this)">删除</a></div></dd>');
|
|
|
+ chens();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ function delalbum(obj){
|
|
|
+ $(obj).parents(".del").remove();
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
<!--请在下方写此页面业务相关的脚本-->
|
|
|
<script type="text/javascript">
|
|
|
</script>
|