|
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>证件资料</title> <link rel="stylesheet" type="text/css" href="../../dist/css/app.min.css"/> <script src="../../dist/js/flexible.js"></script> <script src="../../dist/js/flexible_css.js"></script> <script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <script src="../../dist/js/app.min.js"></script> </head> <body class="accident-container" id="fadan-zhengjianziliao"> <div class="tips"> 上传证件资料<span>(用于接单人报价,最多9张图）</span> </div> <div class="fadan-img-ul"> <ul id="fadan-img-ul-id"> <li> <img src="../../dist/img/images/hk2.png" onclick="maxfunction(this)" class="h" /> <i onclick="deletefunction(this)"></i> <input type="hidden" name="fadanimg1" /> </li> <li> <img src="../../dist/img/images/mp_bg1.jpg" onclick="maxfunction(this)" class="h" /> <i onclick="deletefunction(this)"></i> <input type="hidden" name="fadanimg1" /> </li> <li class="upimg-but"></li> </ul> </div> <div class="fadan-img-but"> <button id="fadan-img-but-id">提交</button> </div> <!-- 照片相册 --> <div class="xiangce-class" id="xiangche-id"> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <div class="swiper-zoom-container"> <img src="../../dist/img/images/hk2.png" class="h" /> </div> </div> <div class="swiper-slide"> <div class="swiper-zoom-container"> <img src="../../dist/img/images/mp_bg1.jpg" class="h" /> </div> </div> </div> <!-- Add Pagination --> <div class="swiper-pagination swiper-pagination-white"></div> <!-- Add Navigation --> </div> </div> <!-- 照片相册 end--> <div class="loading"></div> <script src="../../dist/js/swiper.min.js"></script> <script src="../../dist/js/app-util.js"></script> <script> var swiperindex=0, imgmuber=9; function maxfunction(e){ $("#xiangche-id").removeClass("disnone"); swiperindex=$(e).parents("li").index(); swiper.slideTo(swiperindex, 1000, false); swiper.progress(); } function deletefunction(e){ var index=$(e).parents("li").index(); $(e).parents("li").remove(); swiper.removeSlide(index); swiper.progress(); } var swiper = new Swiper('.swiper-container', { zoom: true, pagination: '.swiper-pagination', observer:true, observeParents:true }); $("#xiangche-id").addClass("disnone"); $(".upimg-but").on("click",function(){ imgmuber=imgmuber-$("#fadan-img-ul-id img").length; if(imgmuber==0) { return false; } window.appUtil = createAppUtil({ type: 99, reqId: 'appUtil', title: '111', shareUrl: '111', content: imgmuber, imageUrl: '111' }, myfunction); appUtil.callApp(); }) var myfunction = function callBackContent(data) { var context="", conhtml=""; $(".loading").show(); for(var i = 0; i < data.length; i++){ context += '<li>'; context += '<img src="data:audio/'+data.img+';base64,'+data.url+'" class="h" />' context += '<i ></i>'; context += '<input type="hidden" name="fadanimg'+i+'" />'; context += '</li>'; conhtml +='<div class="swiper-slide">'; conhtml +='<div class="swiper-zoom-container">'; conhtml +='<img src="data:audio/'+data.img+';base64,'+data.url+'" />'; conhtml +='</div>'; conhtml +='</div>'; } $("#fadan-img-ul-id .upimg-but").before(context); $("#xiangche-id .swiper-wrapper").append(conhtml); var swiper = new Swiper('.swiper-container', { zoom: true }); setTimeout("$('.loading').hide()",500); }; function iosfunction(data) { if ((typeof data).toLowerCase() == 'string') { data = JSON.parse(data); myfunction(data); } } $("#fadan-img-but-id").on("click",function(){ }) </script> </body> </html>
| 
发表于 2017-3-29 17:24:22
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
分享
淘帖
发表于 2017-4-1 16:36:57